typescript 使用接口在打字稿中键入匿名对象
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24264681/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
using a interface to type a anonymous object in typescript
提问by Safari
I have a Interface IBase and a variable that contains a few other objects (in the sample i just added base for a better demonstration)
我有一个接口 IBase 和一个包含一些其他对象的变量（在示例中，我刚刚添加了 base 以便更好地演示）
interface IBase {
height?:number;
width?:number;
}
var element = {
base: {
}
}
How can I say that the object that the varable element.base has is from the type IBase? I know that I could create a type for the element variable that contains the types of base etc, but is that also a possibility to type that scenario without doing so.
我怎么能说变量 element.base 拥有的对象来自 IBase 类型？我知道我可以为包含 base 等类型的元素变量创建一个类型，但这是否也可以在不这样做的情况下输入该场景。
回答by basarat
Van den Brink's answer is good. Just as a demo another option :
范登布林克的回答很好。就像演示一样，另一种选择：
var element = {
base: <IBase> {
}
}
This will give the desired intellisense as well :
这也将提供所需的智能感知：
回答by Paul F. Wood
The excellent answer from @basarat now needs a little updating; using the angle brackets now produces a tslinterror:
@basarat 的出色回答现在需要稍加更新；现在使用尖括号会产生tslint错误：
[tslint] Type assertion using the '<>' syntax is forbidden. Use the 'as' syntax instead. (no-angle-bracket-type-assertion)
[tslint] 禁止使用“<>”语法的类型断言。请改用“as”语法。（无角括号类型断言）
The solution is a simple one:
解决方法很简单：
const element = {
base: {} as IBase
}
This also provides the intellisense (auto-complete) that you'd want as well.
这也提供了您想要的智能感知（自动完成）。
回答by Dick van den Brink
If you change the declaration of var element to the following it knows what base is:
如果将 var 元素的声明更改为以下内容，则它知道基数是什么：
var element: { base: IBase; } = {
base: {
}
}
Note: you can also create a new interface for it like this which makes it a bit more reusable: interface IElement { base: IBase; } and then use it like here: var element: IElement = { base: {} }
注意：你也可以像这样为它创建一个新的接口，这使它更具可重用性： interface IElement { base: IBase; 然后像这里一样使用它： var element: IElement = { base: {} }
回答by Fenton
You have accidentally caused yourself a problem with your interface declaration. It is a subtle one that you will come across with structurally typed languages.
您不小心给自己的接口声明造成了问题。这是一个微妙的，你会遇到结构类型的语言。
interface IBase {
height?:number;
width?:number;
}
Because all of the properties are optional, the interface is essentially {}. i.e. any object satisfies this interface. That's too general to be useful in most cases.
由于所有属性都是可选的，因此接口本质上是{}。即任何对象满足此接口。这太笼统了，在大多数情况下都没有用。
For example, it is perfectly acceptable to do this:
例如，这样做是完全可以接受的：
var x: IBase = {
a: 'efsdsdf',
v: 'sdfdsf'
};
I think you'll agree that reallythis object is not useful anywhere I wanted to use an IBaseobject.
我想你会同意，确实这个对象不是我想用一个非常有用的任何地方IBase对象。
With this out of the way, you may find the most graceful solution is to create an interface that matches your elementdefinition.
考虑到这一点，您可能会发现最优雅的解决方案是创建一个与您的element定义相匹配的接口。
interface IElement {
base: {
height?:number;
width?:number;
}
}
var element: IElement = {
base: {
height: 4
}
}
