Typescript——对象的类型-接口

在Typescript中，我们用接口interfaces来定义对象的类型

ts中的接口是一个非常灵活的概念，除了可以用对于累的一部分行为进行抽象以为，也常用语对【对象的形状（Shape）】进行描述。

简单的例子

// 定义一个接口 Person
// 接口一般首字母大写
interfaces Person {
  name:string;
  age:number;    
}
// 定义了一个变量tom，它的类型是Person.这样，我们就约束了tom的形状必须和接口Person一致
let tom: Person = {
  name:'Tom',
  age:28    
}

定义的变量比接口少了一些属性是不允许的：

interfaces Person {
  name:string;
  age: number;    
}
let tom: Person = {
  name:'Tom'  
}
// 以上是不被允许的，因为没有指定变量的age

多一些属性也是不被允许的：

interfaces Person {
  neme:string;
  age:number;    
}
let tom: Person = {
  neme:'Tom',
  age:25,
  gender:'male'  
}
// 以上是不被允许的，因为比Person类型多了属性

可见，赋值的时候，变量的形状必须和接口的的形状保持一致。

可选属性

有时候我们希望不要完全匹配一个形状，那么可以用可选属性

interfaces Person {
  name:string;  
  age?:number
}
let tom: Person = {
  name:'Tom'  
}
或者
let tom: Person = {
  name:'Tom',
  age:28    
}
// 可选属性的含义是该属性可以不存在，用?来定义

// 这时候任然不允许添加未定义的属性
let tom: Person = {
　　name:'Tom',
　　age:28,
　　gender:'male'
}
// 这是不被允许的

任意属性

有时候我们希望一个接口允许有任意属性，可以用如下方式：

interfaces Person {
  name:string;
  age?:number ;
  [propName:string]:any;
}
let tom:Person = {
  name:'Tom',
  gender:'male'    
}
// 使用[propName:string]定义了任意属性取string类型的值

需要注意的是：一旦定义了任意属性，那么确定属性和可选属性的类型都必须是它的类型的子集，一般用任意类型来定义任意属性（any）

只读属性

有时候我们希望对象中的一些自动只能在创建的时候被赋值，那么可以用readonly定义只读属性

interfaces Person {
    readonly id:number;
    name:string;
    age?:number;
    [prop:string]:any
}
let tom: Person = {
    id:1,
    name:'Tom',
    age:28,
    gender:'male'
}
// readonly 定义的属性id初始化后，将不能再被赋值修改
tom.id = 2    // 这是不允许的，将报错

注意：只读属性的约束存在于第一次给对象赋值的时候，而不是第一次给只读实现赋值的时候

interfaces Person {
    readonly id:number;
    name:string;
    age?:number;
    [prop:string]:any
}
let tom: Person = {
    name:'Tom',
    age:28,
    gender:'male'
}
// 第一处错误，在给tom赋值的是，没有给id赋值

tom.id=1    // 第二处错误，tom.id赋值的是好，由于它是只读属性，所以报错了