用接口自定义类型

书写规则

interface 接口名 {
    变量: 类型;
    变量: 类型;
    ...
}

• 注意内部是分号结尾

• 一般来说 interface 关键词也可以换成 type，用 类型别名 来自定义类型

  type 类型别名 = {
      变量: 类型;
      变量: 类型;
      ...
  }
  

• 但这样就失去了interface的可继承性，不过可以用交叉类型（&）来弥补

一些变化

• 可以在变量后 加?

  • 表示这个变量可有可无

• 可以在变量前 加readonly

  • 表示这个变量不能被修改

• 可索引接口

  • 数字可索引

    interface StringArray {
        [index: number]: string;
    }
    

    • 表示 键可以是任意数字，值是字符串 的数组或对象
  • 字符串可索引

    interface StringArray {
        [x: string]: string;
    }
    

    • 表示 键可以是任意字符串，值是字符串 的对象
  • 二者可以混合使用

一个复杂的组合例子

• 定义接口类型

  interface PersonInfo {
      name: string;
      age: number;
  }
  
  interface Result {
      data: PersonInfo[];
  }
  

• 使用接口类型 定义 结构数据

  let result: Result = {
      data: [
          {
              name: 'Tom',
              age: 10
          },
          {
              name: 'Peter',
              age: 12
          }
      ]
  }
  

• 使用接口类型 定义 函数参数

  function process(res: Result) {
      res.data.forEach((val) => {
          console.log(val.name);
          console.log(val.age);
      })
  }
  

• 调用函数

  process(result);
  

  • 或者明显告知

  process(result as Result)