接口

TypeScript的核心原则之一是对值所具有的结构进行类型检查。 它有时被称做“鸭式辨型法”或“结构性子类型化”。 在TypeScript里，接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。

基本示例

  1. function printLabel(labelledObj: { label: string }) {
  2.   console.log(labelledObj.label);
  3. }
  5. let myObj = { size: 10, label: "Size 10 Object" };
  6. printLabel(myObj);

类型检查器会查看printLabel的调用。 printLabel有一个参数，并要求这个对象参数有一个名为label类型为string的属性。 需要注意的是，我们传入的对象参数实际上会包含很多属性，但是编译器只会检查那些必需的属性是否存在，并且其类型是否匹配。 然而，有些时候TypeScript却并不会这么宽松，我们下面会稍做讲解。

下面我们重写上面的例子，这次使用接口来描述：必须包含一个label属性且类型为string：

  1. interface LabelledValue {
  2.   label: string;
  3. }
  5. function printLabel(labelledObj: LabelledValue) {
  6.   console.log(labelledObj.label);
  7. }
  9. let myObj = {size: 10, label: "Size 10 Object"};
  10. printLabel(myObj);

可选属性

接口里的属性不全都是必需的。 有些是只在某些条件下存在，或者根本不存在。 可选属性在应用“option bags”模式时很常用，即给函数传入的参数对象中只有部分属性赋值了。

  1. interface SquareConfig {
  2.   color?: string;
  3.   width?: number;
  4. }
  6. function createSquare(config: SquareConfig): {color: string; area: number} {
  7.   let newSquare = {color: "white", area: 100};
  8.   if (config.color) {
  9.     newSquare.color = config.color;
  10.   }
  11.   if (config.width) {
  12.     newSquare.area = config.width * config.width;
  13.   }
  14.   return newSquare;
  15. }
  17. let mySquare = createSquare({color: "black"});

只读属性

一些对象属性只能在对象刚刚创建的时候修改其值。 你可以在属性名前用 readonly来指定只读属性:

  1. interface Point {
  2.     readonly x: number;
  3.     readonly y: number;
  4. }

你可以通过赋值一个对象字面量来构造一个Point。 赋值后， x和y再也不能被改变了。

  1. let p1: Point = { x: 10, y: 20 };
  2. p1.x = 5; // error!

readonly vs const

  • 常量使用 const
  • 对象属性使用 readonly