在TypeScript中的对象文字中键入定义

Question

在类中的TypeScript中,可以声明属性的类型,例如:

class className {
  property: string;
};

我应该如何编写代码来声明对象文字中属性的类型？这样的代码不编译:

var obj = {
  property: string;
};

(我收到错误 - 当前范围中不存在名称'string').

我做错了什么或者是一个错误？

Answer 1

你很近,你只需要替换=一个:.您可以使用对象类型文字(请参阅规范第3.5.3节)或界面.使用对象类型文字与您拥有的文字很接近:

var obj: { property: string; } = { property: "foo" };

但您也可以使用界面

interface MyObjLayout {
    property: string;
}

var obj: MyObjLayout = { property: "foo" };

Answer 2

使用强制转换操作符来简化(通过将null转换为所需的类型).

var obj = {
    property: <string> null
};

更长的例子:

var call = {
    hasStarted: <boolean> null,
    hasFinished: <boolean> null,
    id: <number> null,
};

这比两个部分要好得多(一个声明类型,第二个声明默认值):

var callVerbose: {
    hasStarted: boolean;
    hasFinished: boolean;
    id: number;
} = {
    hasStarted: null,
    hasFinished: null,
    id: null,
};

更新2016-02-10 - 处理TSX(谢谢@Josh)

使用TSX的as运算符.

var obj = {
    property: null as string
};

更长的例子:

var call = {
    hasStarted: null as boolean,
    hasFinished: null as boolean,
    id: null as number,
};

Answer 3

您可以使用预定义的实用程序类型Record<Keys, Type>：

const obj: Record<string, string> = {
  property: "value",
};

它允许为您的对象文字指定键：

type Keys = "prop1" | "prop2"

const obj: Record<Keys, string> = {
  prop1: "Hello",
  prop2: "Aloha",
  something: "anything" // TS Error: Type '{ prop1: string; prop2: string; something: string; }' is not assignable to type 'Record<Keys, string>'.
                        //   Object literal may only specify known properties, and 'something' does not exist in type 'Record<Keys, string>'.
};

以及属性值的类型：

type Keys = "prop1" | "prop2"
type Value = "Hello" | "Aloha"

const obj1: Record<Keys, Value> = {
  prop1: "Hello",
  prop2: "Hey", // TS Error: Type '"Hey"' is not assignable to type 'Value'.
};

Answer 4

如果您正在尝试编写类型注释,则语法为:

var x: { property: string; } = ...;

如果您正在尝试编写对象文字,则语法为:

var x = { property: 'hello' };

您的代码正在尝试在值位置使用类型名称.

Answer 5

我很惊讶没有人提到这一点，但是您可以创建一个名为的接口ObjectLiteral，该接口接受key: value成对的type string: any：

interface ObjectLiteral {
  [key: string]: any;
}

然后，您将使用它，如下所示：

let data: ObjectLiteral = {
  hello: "world",
  goodbye: 1,
  // ...
};

另外一个好处是，您可以根据需要在任意数量的对象上多次重复使用此接口。

祝好运。

Answer 6

在打字稿中如果我们正在声明对象那么

[access modifier]变量名:{//对象结构}

[access modifier] variable name : { /* structure of object */ }

Answer 7

谨防。对于某些人来说，这似乎是显而易见的，但类型声明：

const foo: TypeName = {}

与以下类型的铸造不同as：

const foo = {} as TypeName

尽管建议在其他答案上使用它。

例子：

谢谢，类型安全！：

const foo: { [K in 'open' | 'closed']: string } = {}
// ERROR: TS2739: Type '{}' is missing the following properties from type '{ open: string; closed: string; }': open, closed

再见，类型安全！：

const foo = {} as { [K in 'open' | 'closed']: string }
// No error

Answer 8

这就是我在 2021 年使用 TypeScript 4.5 所做的事情：

const sm = {
  reg: {} as ServiceWorkerRegistration,
  quantum: null as number | null,
  currentCacheName: '' as string, // superfluous
  badSWTimer: 0 as number, // superfluous
}

这不仅仅是一个值转换，而且对于对象属性来说，其工作方式与接口定义相同。

更新：我包含了两个多余的类型作为示例。也就是说，这些类型可以自动推断，因此不会生成编译器错误。

来源：4.4 游乐场

Answer 9

// Use ..

const Per = {
  name: 'HAMZA',
  age: 20,
  coords: {
    tele: '09',
    lan: '190'
  },
  setAge(age: Number): void {
    this.age = age;
  },
  getAge(): Number {
    return age;
  }
};
const { age, name }: { age: Number; name: String } = Per;
const {
  coords: { tele, lan }
}: { coords: { tele: String; lan: String } } = Per;

console.log(Per.getAge());

Answer 10

如果您尝试向解构的对象常量添加类型，例如在函数的参数中，则语法为：

function foo({ bar, baz }: { bar: boolean, baz: string }) {
  // ...
}

foo({ bar: true, baz: 'lorem ipsum' });

Answer 11

在你的代码中：

var obj = {
  myProp: string;
};

您实际上是在创建一个对象文字并将变量字符串分配给属性 myProp。尽管这种做法非常糟糕，但这实际上是有效的 TS 代码（不要使用它！）：

var string = 'A string';

var obj = {
  property: string
};

然而，您想要的是键入对象文字。这可以通过多种方式实现：

界面：

interface myObj {
    property: string;
}

var obj: myObj = { property: "My string" };

类型别名：

type myObjType = {
    property: string
};

var obj: myObjType = { property: "My string" };

对象类型文字：

var obj: { property: string; } = { property: "Mystring" };

Answer 12

从 TypeScript 4.9 开始，satisfies 运算符可用于进行内联断言。您可以将它用于一个值或整个对象，如下所示：

interface NameInfo {
  first: string;
  last: string | undefined;
}
const people = {
  john: { first: "John", last: "Doe" },
  jane: { first: "Jane", last: "Doe" } satisfies NameInfo,
} satisfies Record<string, NameInfo>;

另一种选择是创建一个具有静态属性的类：

class TestData {
  static people: Record<string, NameInfo> = {
    john: { first: "John", last: "Doe" },
    jane: { first: "Jane", last: "Doe" },
  };
}