TypeScript2(接口类型)

69 阅读2分钟

1.接口定义

使用interface来定义一种约束,让数据的结构满足约束的格式,接口名称以大写开头

interface Eg{
    property:type;//属性:类型
    fun:(params:type)=>type;//方法:参数类型、返回值类型,没有返回值就使用void
}

2.接口约束时不能多属性或者少属性

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

const person: Person = {
    name: "YaeZed",
    age: 25
}

3.重名的接口可以合并

interface Repeat { name: string }
interface Repeat { age: number }
const r: Repeat = {
    name: "YaeZed",
    age: 23
}

4.接口可以继承

使用extends继承

interface Animal { name: string }
interface Dog extends Animal { voice: string }
const dog: Dog = {
    name: "金毛",
    voice: "wangwang"
}

5.可选属性,属性名后加?

interface Optional {
    name: string;
    age?: number;
}
const optional: Optional = {
    name: "YaeZed"
    // age: 25
}

6.任意属性

一般定义为any,需要注意的是:一旦定义了任意属性,那么确定属性和可选属性的类型必须是任意属性的子集

可以允许添加新的任意属性

interface Any {
    name: string;
    age: number;
    [propName: string]: any;
}

const any: Any = {
    name: "YaeZed",
    age: 25,
    sex: "male"
}

7.readonly属性

只读属性只能在创建时初始化,不能再次赋值

interface Readonly {
    name: string;
    readonly age: number;
}

const readonly: Readonly = {
    name: "YaeZed",
    age: 25
}

// readonly.age = 25; // 修改只读属性会报错

8.接口里添加函数

interface Fun {
    // 参数类型和返回值类型都需要指定
    greeting: (name: string) => string;
}
const fun: Fun = {
    greeting: (name: string) => "Hello, " + name

}
console.log(fun.greeting("YaeZed"));//调用

9.plus

在TypeScript中,当接口指定返回类型为void时,函数实现仍然可以返回值。这是TypeScript的类型系统特性之一。但是不能将其赋值使用

interface Fun {
    // 参数类型和返回值类型都需要指定
    greeting:(name: string) => void;
}
const fun: Fun = {
    greeting: (name: string) => "Hello, " + name

}
console.log(fun.greeting("YaeZed"));//这里可以打印出内容
const a: string = fun.greeting("YaeZed"); // 报错,不能将void赋值给string

参考文章

小满zs 学习typeScript3(接口和对象类型)blog.csdn.net/qq119556631…