TS 接口类型

48 阅读1分钟
// 接口不能有具体的实现,可以用来描述 函数、混合类型、对象、类
interface IFullname {
    firstname:string
    lastname:string
}
type Ifn = (obj:IFullname) => string
const fullname:Ifn = ({firstname,lastname}):string => {
    return firstname + lastname
}
// type 和 interface 的区别
// 1. 如果只是描述结构,可以使用 interface
// 2. 如果设计到联合类型,则只能使用 type
type A = {
    name: string
}
type B = {
    age: number
}
type C = A | B

let c: C = {
    age: 18
}
// 3. type 不能被扩展,interface 可以扩展,使用 extends
interface A {
    name: string
    age: number
}
interface B {
    sex: number
}
interface C extends A, B {
    height: number
}
let c: C = {
    name: 'zhangsan',
    age: 18,
    sex: 0,
    height: 180
}
4. type 不能重名,interface 重名可以合并
type A = { // 重复声明
    name:string
}
type A = { // 重复声明
    
}

interface A {
    name: string
}
interface A {
    age: number
}
let a: A = {
    name: 'lisi',
    age: 18
}

5. type 可以使用循环和条件,interface 不行
//其他情况无所谓,可以互换(函数类型一般使用 type 来声明)
数字索引
interface IArr {
    [key:number]:any
}
let arr:IArr = [1,2,3]

或者

interface IArr {
    [key: number]: any
}
let arr: IArr = {
    0: 1,
    1: 2,
    2: 3
}
// 通过索引获取值的类型
interface Person {
    name: string
    age: number
}
type PersonName = Person['name'] // string
// keyof 和 valueOf
// keyof 时一个对象中 key 的集合
interface Icar {
    color: string,
    speed: number
}
type A = keyof Icar

let a:A = 'color'
let b:A = 'speed'
let c:A = 'speed1' // speed1 不能分配给 keyof Icar

// valueOf 取值的类型集合
interface Icar {
    color: string,
    speed: number
}
type A = keyof Icar

type ValueOf = Icar[A] //  string | number
interface Person{
    name:string
    age:number
    son:{
        name:string
        age: number
    }
}
type SonNameAgeType = Person['son']['age']
// 类可以实现多个接口
interface Chinese{
    toSpeekChinese():void
}
interface English{
    toSpeekEnglish():void
}
class Speak implements Chinese,English{
    toSpeekChinese(){
        
    }
    toSpeekEnglish(){

    }
}