在 TypeScript 中定义和使用键值对
Defining and using Key-Value pair in TypeScript
使用索引签名在 TypeScript 中定义键值对,例如
const employee: { [key: string]: string | number } = {}
. 当我们事先不知道类型键的所有名称,但我们知道它们值的形状时,使用索引签名。
const employee: { [key: string]: string | number } = {}; employee.name = 'James'; employee.salary = 100; // 👇️ {name: 'James', salary: 100} console.log(employee);
我们使用索引签名来定义 TypeScript 中的键值对;。
该{[key: string]: string}
语法是 TypeScript 中的
索引签名
,当我们事先不知道类型属性的所有名称但知道值的形状时使用。
string
时,它将返回一个类型为string
or的值number
。{[key: string]: any}
您可能还会在示例中看到索引签名。它表示一个键值结构,当用字符串索引时返回一个any
类型(非常广泛)的值。
const employee: { [key: string]: any } = {}; employee.name = 'James'; employee.salary = 100; employee.years = [2021, 2022]; // 👇️ {name: 'James', salary: 100, years: [2021, 2022]} console.log(employee);
当{[key: string]: any}
我们事先不知道类型键的名称和值的形状时,索引签名用于创建键值对。
您可以提前声明您知道的键和值的类型,并为您不知道的键和值使用any
类型。
type Employee = { [key: string]: any; name: string; salary: number; }; const employee: Employee = { name: 'James', salary: 100, }; employee.country = 'Chile'; employee.years = [2021, 2022];
我们声明了name
和salary
属性的类型,这是我们提前知道的,并且使用索引签名仍然允许我们将具有任何值的任何键分配给对象。
name
和salary
属性的类型支持,如果我们尝试将属性设置为不兼容的类型,类型检查器会抛出错误。如果您尝试将不兼容类型的属性分配给该对象,则会出现错误。
type Employee = { [key: string]: string; }; const employee: Employee = { name: 'James', }; // ⛔️ Type 'number' is not assignable // to type 'string'.ts(2322) employee.salary = 100;
我们使用了带有字符串键和值的索引签名,因此如果我们尝试向对象添加值,类型检查器会显示错误number
。
但是,我们不能简单地添加一个salary
类型为number
to
的键Employee
,因为我们已经指定所有类型为 string 的键的值为string
。
索引签名{[key: string]: string}
意味着当对象被索引为 a 的键时string
,该值将始终为 a
string
。
type Employee = { [key: string]: string; // ⛔️ Error: Property 'salary' of type 'number' // is not assignable to 'string' index type 'string'. salary: number; };
要解决这个问题,您必须使用
联合类型。
type Employee = { [key: string]: string | number; salary: number; }; const employee: Employee = { name: 'James', salary: 100, };
新的索引签名意味着如果对象使用string
键索引,它会返回一个string
or值number
,因此我们能够在具有number
值的类型上设置其他属性。