TypeScript 对象类型

摘要:在本教程中,您将学习 TypeScript 的 object 类型以及如何编写更准确的 object 类型声明。

TypeScript 对象类型的介绍

TypeScript 的 object 类型表示所有不是原始类型的值。

以下是 TypeScript 中的原始类型

以下显示了如何声明一个保存对象的变量

let employee: object;

employee = {
    firstName: 'John',
    lastName: 'Doe',
    age: 25,
    jobTitle: 'Web Developer'
};

console.log(employee);Code language: TypeScript (typescript)

输出

{
  firstName: 'John',       
  lastName: 'Doe',
  age: 25,
  jobTitle: 'Web Developer'
}Code language: TypeScript (typescript)

如果您将原始值重新分配给 employee 对象,您将收到错误

employee = "Jane";Code language: TypeScript (typescript)

错误

error TS2322: Type '"Jane"' is not assignable to type 'object'.Code language: JavaScript (javascript)

employee 对象是一个具有固定属性列表的 object 类型。如果您尝试访问 employee 对象上不存在的属性,您将收到错误

console.log(employee.hireDate);Code language: CSS (css)

错误

error TS2339: Property 'hireDate' does not exist on type 'object'.Code language: JavaScript (javascript)

请注意,上述语句在 JavaScript 中可以完美运行,并返回 undefined

要显式指定 employee 对象的属性,您首先使用以下语法声明 employee 对象

let employee: {
    firstName: string;
    lastName: string;
    age: number;
    jobTitle: string;
};Code language: TypeScript (typescript)

然后将 employee 对象分配给具有所描述属性的字面量对象

employee = {
    firstName: 'John',
    lastName: 'Doe',
    age: 25,
    jobTitle: 'Web Developer'
};Code language: TypeScript (typescript)

或者您可以在同一语句中组合这两种语法,如下所示

let employee: {
    firstName: string;
    lastName: string;
    age: number;
    jobTitle: string;
} = {
    firstName: 'John',
    lastName: 'Doe',
    age: 25,
    jobTitle: 'Web Developer'
};Code language: TypeScript (typescript)

object 与 Object

TypeScript 还有另一种类型称为 Object,其中字母 O 为大写。了解它们之间的区别非常重要。

object 类型表示所有非原始值,而 Object 类型描述所有对象的函数。

例如,Object 类型具有 toString()valueOf() 方法,任何对象都可以访问这些方法。

空类型 {}

TypeScript 还有另一种称为空类型的类型,用 {} 表示,它与对象类型非常相似。

空类型 {} 描述一个自身没有任何属性的对象。如果您尝试访问此类对象上的属性,TypeScript 将发出编译时错误

let vacant: {};
vacant.firstName = 'John';Code language: TypeScript (typescript)

错误

error TS2339: Property 'firstName' does not exist on type '{}'.Code language: JavaScript (javascript)

但是您可以访问在 Object 类型上声明的所有属性和方法,这些方法可通过 原型链 在对象上获得。

let vacant: {} = {};
console.log(vacant.toString());Code language: TypeScript (typescript)

输出

[object Object]Code language: JSON / JSON with Comments (json)

总结

  • TypeScript 的 object 类型表示任何不是原始值的值。
  • 但是,Object 类型描述了所有对象上可用的功能。
  • 空类型 {} 指的是自身没有任何属性的对象。
本教程是否有帮助?