『TypeScript』类型守卫

最新推荐文章于 2024-08-13 07:50:18 发布

安稳觉

最新推荐文章于 2024-08-13 07:50:18 发布

阅读量602

点赞数

文章标签： typescript 前端 javascript

本文链接：https://blog.csdn.net/weixin_54182512/article/details/121313306

版权

本文介绍了TypeScript中的类型守卫技术，包括使用in关键字、typeof关键字、instanceof以及自定义类型保护和类型谓词来确保变量在特定类型的范围内。通过这些方法，可以在运行时检查和缩小变量的类型，提升代码的类型安全性。

摘要由CSDN通过智能技术生成

类型缩小：type Narrowing

类型守卫是一个值确保在该类型的范围内。

1. in 关键字

interface InObj1 {
    a: number,
    x: string
}
interface InObj2 {
    a: number,
    y: string
}
function isIn(arg: InObj1 | InObj2) {
    // x 在 arg 打印 x
    if ('x' in arg) console.log('x')
    // y 在 arg 打印 y
    if ('y' in arg) console.log('y')
}
isIn({a:1, x:'xxx'});
isIn({a:1, y:'yyy'});

2. typeof 关键字

function isTypeof( val: string | number) {
    if (typeof val === "number") return 'number'
    if (typeof val === "string") return 'string'
    return '啥也不是'
}

typeof 只支持：typeof 'x' === 'typeName' 和 typeof 'x' !== 'typeName'，x 必须是 'number', 'string', 'boolean', 'symbol'。

3. instanceof

function creatDate(date: Date | string){
    console.log(date)
    if(date instanceof Date){
        date.getDate()
    }else {
        return new Date(date)
    }
}

4. 自定义类型保护和类型谓词

function isNumber(num: any): num is number {
    return typeof num === 'number';
}
function isString(str: any): str is string{
    return typeof str=== 'string';
}