TypeScript-入门(六)-类型兼容、断言

49 阅读3分钟

一、类型兼容

1.类型完全匹配

我们声明变量类型后,如果采用字面量赋值,会要求变量的类型和声明类型一致

type N = {
    name: string,
    age: number
}
// 若缺少属性或多了属性,都会报错
let n: N = {
    name: 'zs',
    age: 12
}

2.鸭子辨型法

鸭子辨型法(Duck Typing)指的是一种类型系统的理念,即一个对象的类型是由其方法和属性的形状(shape)决定的,而不是通过特定的类或接口来定义。这种理念源自于动态类型语言中的一种思想,即“如果它走起路来像鸭子,叫起来像鸭子,那么它就是一只鸭子”。

在 TypeScript 中,当我们使用一个对象时,不一定需要显式地声明它符合某个接口或类,只要它包含我们期望的属性和方法,就可以被认为是具有相同类型。这就是鸭子辨型法的体现。

常用来请求后端接口时,后端返回一堆数据,但我们只需要使用其中的某几个属性时,可以用鸭子辨型法

type Duck = {
    sound: '嘎嘎嘎',
    swim(): void
}

const person = {
    name: '这是一个人',
    age: 12,
    sound: '嘎嘎嘎' as '嘎嘎嘎', // 断言,若不断言,这是ts会进行类型推断,变成了string,这里采用断言,定义为字面量类型
    swim() {
        console.log(this.name + '会' + this.sound);
    }
}
// 这里可以直接赋值,即person内部必须含有Duck定义的类型,只能多,但不能少
let duck: Duck = person
// 若采用字面量赋值,则必须符合Duck定义的类型,不能多,也不能少
let duck2: Duck = {
    sound: '嘎嘎嘎',
    swim() { }
}

二、断言

断言(Assertion)是一种开发者告诉编译器某个值的具体类型的方式。它告诉编译器,开发者有更多的信息,因此可以将某个值当做特定类型来处理。断言在需要处理类型不确定或者编译器无法正确推断类型的情况下很有用。

2.1 尖括号法

// 使用尖括号进行类型断言
// 这里断言为字符串,所以可以使用字符串的方法
let str: any = 'asfasfdasdfasdf'
let res: number = (<string>str).length

2.2 as 断言

// 这里使用as断言为字符串
let str: any = 'asfasfdasdfasdf'
let res: number = (str as string).length

总结

与尖括号语法相比,as 语法更加推荐,尤其在 JSX/TSX 中,因为尖括号语法可能与 JSX 的语法产生冲突。 断言主要用于以下情况:

  • 当你比编译器更清楚某个变量的类型时。
  • 当你从一个类型转换为另一个类型时。
  • 当你处理一些编译器无法正确处理的情况时。

需要注意的是,断言并不会影响运行时的类型,它仅在编译阶段提供了一些类型的信息给编译器。如果断言的类型不正确,可能会导致运行时错误。因此,在使用断言时,确保你了解确切的类型,并尽量避免对类型的过度假设。