typescript 如何使用变量键初始化打字脚本接口

7uhlpewt  于 2023-01-10  发布在  TypeScript
关注(0)|答案(2)|浏览(163)

请看下面的代码:

function createObj(key: string, value:unknown) {
  const obj = {};
  obj[key] = value;
  return obj;
}

给出错误:
TS 7053:元素隐式具有“any”类型,因为“string”类型的表达式不能用于索引类型“{}”。 在类型“{}”上找不到参数类型为“string”的索引签名。
我知道我可以写成

const obj = {} as Record<string, unknown>;

但我想知道是否可以用一条语句初始化对象

const obj = {
    key: value
  };

这不起作用,因为key在这里是字符串文字,而不是变量key的值。

cx6n0qe3

cx6n0qe31#

可以使用计算属性名称(由another answer引用),如下所示:

function createObj(key: string, value: unknown) {
  return {
    [key]: value,
  };
}
dldeef67

dldeef672#

当你创建一个空对象时,TS禁止你给它添加任何属性,因为根据推理,它应该是空的。我说的是这一行:

const obj = {};

因此,为了以TS方式进行,您需要推断提供的参数:

function createObj<Key extends PropertyKey, Value>(key: Key, value: Value): Record<Key, Value>
function createObj<Key extends PropertyKey, Value>(key: Key, value: Value) {
  const obj: Partial<Record<Key, Value>> = {};
  obj[key] = value;
  return obj;
}

const result = createObj('a', 1)
result.a // number

Key-表示key参数的推断类型
Value-表示value参数的推断类型
对于obj,我使用了Partial<Record<Key, Value>>类型。对于PartialRecord,请参见docs
Partial-所有值都是可选的
Record-表示散列Map数据结构(JavaScript中的常规对象)
您可能已经注意到,result.a被推断为一个数字。
我们可以做得更好。只需添加类型Json

type Json =
  | null
  | undefined
  | string
  | number
  | Array<Json>
  | { [prop: string]: Json }

function createObj<Key extends PropertyKey, Value>(key: Key, value: Value): Record<Key, Value>
function createObj<Key extends PropertyKey, Value>(key: Key, value: Value) {
  const obj: Partial<Record<Key, Value>> = {};
  obj[key] = value;
  return obj;
}

const result = createObj('a', 1)
result.a // 1

现在,result.a1

相关问题