TypeScript中的Interface接口

这是我参与11月更文挑战的第16天，活动详情查看：2021最后一次更文挑战

官方解释

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

主要功能：

• 对对象的形状（shape）进行描述
• Duck Typing(鸭子类型)

Duck Typing(鸭子类型)：鸭子类型（英语：duck typing）在程序设计中是动态类型的一种风格。在这种风格中，一个对象有效的语义，不是由继承自特定的类或实现特定的接口，而是由"当前方法和属性的集合"决定。参考 ：维基百科zh.wikipedia.org/wiki/鸭子类型

因为Interface是不存在与Javascript中的概念所以TypeScript在编译以后Interface是不会被转换的所以只能用来做静态的类型检查。

interface Person{
    name: string;
    age: number;
}

let xiaochen: Person = {
    name:'xiaochen',
    age: 20,
}

在这里如果我们的类型或者值的数量不正确会报错。

缺少数据：

interface Person{
    name: string;
    age: number;
}

let xiaochen: Person = {
    name:'xiaochen',
    
}

报错信息：

多余的数据：

interface Person{
    name: string;
    age: number;
}

let xiaochen: Person = {
    name:'xiaochen',
    age: 20,
    id: 123,
}

报错信息：

类型错误：

interface Person{
    name: string;
    age: number;
}

let xiaochen: Person = {
    name:200,
    age: 20,
}

报错信息：

可选属性

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

示例：

interface Person{
    name: string;
    age?: number;
}

let xiaochen: Person = {
    name:'xiaochen',
}

只读属性

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

interface Person{
    readonly id: number;
    name: string;
    age?: number;
}

let xiaochen: Person = {
    id: 1,
    name:'xiaochen',
    age: 20,
}

当我们想要修改只读属性的数据时会报错。

示例：

interface Person{
    readonly id: number;
    name: string;
    age?: number;
}

let xiaochen: Person = {
    id: 1,
    name:'xiaochen',
    age: 20,
}
xiaochen.id = 2

报错信息：

小结

• Interface是不存在与Javascript中的概念，所以只能用来做静态的类型检查。
• 可以在属性名称后面增加?来表示可选属性比如：age?: number;
• 可以在属性名称前面增加readonly来指定只读属性比如：readonly id: number;