当前位置: 首页 > article >正文

TypeScript -类型断言的简单理解

类型断言是干啥的

类型断言 : 是手动的给某个变量 指定类型,从而可以方便操作该类型的属性和方法。

类型断言的两种写法

方式一 : 变量名 as 类型

let x: number | string = 'abc';
console.log((x as string).length); // 输出 3 ,因为是个字符串

方式二 :<类型> 变量名

let x: number | string = 'abc';
console.log((<string>x).length); // 输出 3 ,因为是个字符串

类型断言的理解误区

注意 :
1、类型断言只是为了方便明确变量的类型,而不是将变量的类型进行改变!!!
2、因此,类型断言在使用的时候,建议 在我们已经明确知道变量是什么类型的时候使用,
这样才能够真正发挥类型断言的作用。

例如 :

let x:number = 123;
// 这样写,ts 并不会报错,
//但是 实际上并不会将 x 真正的转为string 类型,最终的输出结果是 undefined
console.log((<string>x).length)

举个例子理解一下

// 定义一个函数
function m1(x : string  | number){
    console.log((x as string).length)
}

// 分别用不同类型的数据参数调用一下函数
m1(1234567890); // undefined
m1('1234567890'); // 10

结果分析:
1、函数的作用是 : 输出字符串参数的长度
2、第一次调用的参数是数值类型,没有 length 属性,因此输出 undefined
3、第二次调用的参数是字符串类型,正常输出字符串的长度10

小结:
类型断言并不是类型转换!
类型断言并不是类型转换!
类型断言并不是类型转换!

特殊的any

为什么要特别提一下 any 这个类型呢。
因为 any 类型会覆盖 ts 的类型检查,没有类型之后就可以任意操作了,自由自在。
所以,在进行类型断言的时候,要慎重使用。

任意类型断言为any

放飞自我的任意类型any,变量可以随意赋值,又回到了最初js中的状态,无拘无束。

let y : string | number;
// 断言为 any 类型之后,随便写,不会提示错误,而且运行正常
(<any>y) = {
    a:'aaa',
    b:'bbb'
}
console.log(y); // { a: 'aaa', b: 'bbb' }

any 断言为其他具体类型

被强加的束缚,不再自由,卑微的活着。
嗯,其实也不算卑微,因为此时我们必然是知道具体的类型了,反正就是这样。

// 将any 断言为一个具体的类型
let z : any = '123';
console.log((<string>z).length); // 3

http://www.kler.cn/a/107850.html

相关文章:

  • Ubuntu 的 ROS 操作系统安装与测试
  • 软件工程师简历(精选篇)
  • Mysql数据库里的SSH连接
  • 【计算机网络】UDP网络程序
  • 车-路-站-网”信息耦合的汽车有序充电
  • 深入解析 OpenHarmony 构建系统-4-OHOSLoader类
  • 牛客小白月赛80 D一种因子游戏
  • 【C++】C++入门(下)--内联函数 auto关键字 nullptr
  • Java IDEA controller导出CSV,excel
  • 07-定位布局
  • Nginx的进程结构实例演示
  • RK3568平台 IIC子系统框架
  • Mybatis基础
  • C语言之错误处理
  • 前端CodeReivew实践 | 京东云技术团队
  • lesson2(补充)关于const成员函数
  • IP网络矿用打点紧急广播方案
  • 业界中说的快速原型法是什么
  • 如何使用PHPicker在iOS系统无授权下获取资源
  • 从澎湃OS以小见大,看小米怎么玩转车机
  • #经典论文 异质山坡的物理模型 2 有效导水率
  • Unity3D 多人联机网络游戏开发都存在哪些误区详解
  • 【mediasoup-sfu-cpp】5: SfuDemo:分发ok
  • 自然语言处理 (NLP) 简介
  • SpringBoot使用WebSocket收发实时离线消息
  • 【理论知识:Window Aggregation】flink 窗口聚合功能概述:两种窗口聚合模式的使用例子、功能说明