需要TypeScript批注通过变量访问对象属性

Question

在普通的JavaScript中，我们可以使用变量来读取对象属性的值。

即，这是有效的：

let obj = { a: 100, b: 200, c: 300 };
let prop = 'b';
console.log( obj[prop] );  // 200

但是，下面的TypeScript注释将prop声明为字符串会导致指示的索引错误。

let obj: object = { a: 100, b: 200, c: 300 };
let prop: string = 'b';
console.log( obj[prop] );  // TypeScript error that element index can't be a string

我应该如何注释以上内容？

Answer 1

避免使用object作为类型，TS不能从中扣除该怎么做。

考虑添加类型，该类型允许您要做的事情：

let obj: { [key: string]: number } = { a: 100, b: 200, c: 300 };
let prop: string = 'b';
console.log( obj[prop] );

您甚至可以通过使用[key in type]语法（其中type是类型定义：）来进一步优化：

type props = 'a' | 'b' | 'c';
let obj: { [key in props]: number } = { a: 100, b: 200, c: 300 };
let prop: props = 'b';
console.log(obj[prop]);