typescript - 当接口(interface)用作函数的返回类型时，接口(interface)允许额外的属性

Question

当通过类型将接口(interface)分配为函数的返回时，它似乎接受额外的属性。

例如，如果我有一个名为 MyInterface 的空接口(interface)，一个函数类型:type MyFunction = () => MyInterface; 和一个函数 const myFunction: MyFunction = () => ({ foo: 'bar' }) 它不会为 foo 属性抛出任何错误。

这里有一些例子:

// No 'age' property
interface Human {
  name: string;
}

const human: Human = {
  name: '',
  age: 0 // Error
}

type HumanCreator = (name: Human['name'], age: number) => Human;

const humanCreator: HumanCreator = (name, age) => ({
  name,
  age // No error. Why?
});

const humanCreatorr: HumanCreator = (name, age): Human => ({
  name,
  age // Error
});

const humanCreatorrr = (): Human => ({
  name: '',
  age: 0 // Error
});

为什么当我用 HumanCreator 键入变量 humanCreator 时它不关心我是否向返回的对象添加了额外的属性？

Answer 1

An inteface seems to accept extra property(ies) when it is assigned as a return of a function via a type.

通常，TypeScript 使用 structural typing , 因此将具有附加属性的对象分配给 Human 接口(interface)是完全没问题的。

const lui = {
  name: "Lui",
  age: 40
}

const human: Human = lui // works, 

您可以将 lui 分配给类型为 Human 的变量 human，因为 typeof lui 是一个子类型因此具有相同/兼容的属性成员。

此规则的一个异常(exception)是 excess property checks对于“新创建的对象文字”，旨在帮助开发人员并禁止添加额外的属性。这里的一般想法是，当您定义没有其他间接访问(访问变量等以获取该对象值)的直接对象文字时，您确切地知道您想要什么属性。

额外的属性检查需要在处理新对象文字的变量、属性或函数上紧随其后的显式类型注释才能工作。否则对象文字类型不再算作“新鲜”(它的类型是 widened )。让我们检查您的示例来说明这个概念。

const humanCreator: HumanCreator = (name, age) => ({
  name,
  age // No error. Why?
});

您可以将此视为类型兼容函数对类型为 HumanCreator 的变量的赋值。编译器查看函数表达式 (name, age) => ({ name, age })，推断参数类型并确保其返回类型与变量类型兼容。确实 - {name: string; age:number 返回类型可分配给 Human(结构类型)。

const humanCreatorr: HumanCreator = (name, age): Human => ({
  name,
  age // Error
});

const humanCreatorrr = (): Human => ({
  name: '',
  age: 0 // Error
});

这些情况不同，因为您立即使用 Human 返回类型注释函数。编译器不需要返回类型的类型推断。 tl;dr 要启用额外的属性检查，请尽可能接近地为您的对象字面量注释显式类型。

更多链接

• Excess property checks in TS specifications
• Widened types
• Good introduction article about excess property checks