在 TypeScript 中向 JavaScript 对象添加数据答案

【问题标题】：Add data to JavaScript Object in TypeScript在 TypeScript 中向 JavaScript 对象添加数据
【发布时间】：2016-06-18 17:40:08
【问题描述】：

所以在普通的 Javascript 中你可以很好地执行这段代码：

var myObj = {};
myObj['one'] = {};

console.log(myObj);
console.log(myObj.one);

但是你在 TypeScript 中得到这个错误Property 'one' does not exist on type '{}'

这只是设计使然吗？（例如，我应该为此制作自己的课程）

【问题讨论】：

【解决方案1】：

damitij07's answer 涵盖了很多处理这个问题的方法，但我想指出我最喜欢这种用例：interfaces。

interface myObj {
  one:any;
}

现在您可以将变量标记为接口，Typescript 将检查以确保对象符合要求。像其他任何东西一样传递它，比如类等等，它会在编译时消失。 js引擎不需要额外的工作，只需要编译时检查。

const myObjInstance:myObj = {one:0};
function foo(x:myObj):myObj { return x; }

如果您需要该字段是可选的，

interface myObj {
  one?:any;
}

现在，如果您不分配给该字段，Typescript 将不会抱怨。

最后一点，这一切都假设您相信该对象是您所期望的。如果您是从外部获取它，即使您拥有它，您也应该在运行时检查该结构是否是您希望避免错误的结构。

【讨论】：

【解决方案2】：

Typescript 通过在声明对象时预测对象的类型来编写类似这样的代码时引入类型绑定错误。

var myObj = {};
myObj['one'] = {};

有许多建议的方法可以解决这种歧义，或者说是编码：

创建类对象并创建实例。

export class myObj {
  one:any;
}

let myObjInstance:myObj = new myObj();
myObjInstance.one = {};
//
console.log(myObj);
console.log(myObj.one);

另一种简单的出行方式是

//set type of myObj is any
let myObj:any = {};
myObj['one'] = {};
//no error
console.log(myObj);
console.log(myObj.one);

或者如果你想要动态类型转换

let myObj = {};
//cast while assigning
(<any>myObj)['one'] = {};

//no error
console.log(myObj);
console.log(myObj.one);

【讨论】：