4、TypeScript基础数据类型
2022-03-31 13:00:09 0 举报
AI智能生成
前端开发,TS学习
作者其他创作
大纲/内容
与JS共有的
数字类型 number
除了支持十进制和十六进制字面量,TypeScript还支持ECMAScript 2015中引入的二进制和八进制字面量。<br>
字符串类型 string
let name: string = '金色小芝麻'
布尔类型 boolean
let isGirl: boolean = true
null 和 undefined
默认情况下null和undefined是所有类型的子类型。
在tonfig.json文件中<br><font color="#b71c1c">--strictNullChecks设置为 true</font> 标记(默认是 false)<br>
<font color="#b71c1c">null和undefined只能赋值给void和它们各自。</font><br>
反之,可以把 null和undefined赋值给number或者 string 等类型的变量。<br>
Symbol 类型
Symbol 是在ES2015之后成为新的原始类型, 所以在<b><font color="#b71c1c">使用 Symbol 的时候,必须添加 es6 的编译辅助库</font></b>
"lib": ["es6", "dom", "ESNext"]
注意:如果不写 lib 时 TS 会自己默认识别编译, 但如果写了 lib 就必须指定所有需要使用的 辅助编译库, 否则就会导致编译不成功
BigInt 类型
使用 BigInt 可以安全地存储和操作大整数,即使这个数已经超出了JavaScript构造函数 Number 能够表示的安全整数范围。
let res: BigInt = BigInt(Number.MAX_SAFE_INTEGER)
BigInt 类型在 TypeScript3.2 版本被内置,同 Symbol 情况类似,在使用 BigInt 的时候,必须添加 ESNext 的编译辅助库
TS 独有的
数组类型 array
数组类型
类数组类型
常用的类数组都有自己的接口定义:<br> IArguments 、 HTMLElement 、 HTMLCollection 、 NodeListOf...<br>
元组类型 tuple
元组(Tuple)表示一个已知数量和类型的数组<br>
元组越界问题
TS 允许向元组中使用数组的push方法插入新元素<br>
但是访问新加入的元素时,会报错<br>
枚举类型 enum<br>
枚举类型用于定义数值集合
事先考虑某一个变量的所有可能的值,尽量用自然语言中的代词表示它的每一个值<br>
比如性别(男女)、月份(1-12)、星期(一-日)、颜色(红橙黄绿蓝靛紫)...
枚举的本质
我们以上面的枚举为例:
编译后的 .js 文件:编译工具:https://www.typescriptlang.org/play
步骤分析
第一步 var Gender
声明一个 Gender 变量 并且初始值 是 空对象
第二步 (function (Gender) {...})(Gender || (Gender = {}));:
将 Gender 对象 作为自执行函数的 实参传入
第三步 Gender["GIRL"] = 0 :
给 Gender 对象 的 “GIRL” 属性赋值为 0
Gender = {<br> "GIRL" : 0,<br> <font color="#00ff00"><b> “0”:“GIRL”,<br></b></font> <b><font color="#f57c00"> "BOY": "1",<br></font></b> <b><font color="#b71c1c">"1": "BOY"</font></b><br>}<br>
第四步 Gender[Gender["GIRL"] = 0] = "GIRL" :
给 Gender 对象 新增一个 属性名为“0” 的属性,并且给其赋值为 "GIRL"
以此类推...
所以最终结果是
Gender = {<br> "GIRL" : 0,<br> <font color="#00ff00"><b> “0”:“GIRL”,<br></b></font> <b><font color="#f57c00"> "BOY": "1",<br></font></b> <b><font color="#b71c1c">"1": "BOY"</font></b><br>}<br>
这也是为什么 枚举 可以正反向同时映射的原因。
正向映射即:name => value
反向映射即: name <=> value
几种常见的枚举
数字枚举
当我们声明一个枚举类型时, 它们的值其实是默认从0开始依次累加的数字类型;
当我们把第一个值赋值后,后面也会根据第一个值进行累加:
字符串枚举
字符串枚举不支持反向映射
异构枚举
通常情况下我们很少会这样使用枚举,但是从技术的角度来说,它是可行的。
常数枚举
在声明枚举前加一个 const 声明<br>
枚举成员的类型
枚举成员分为 常量枚举成员 const 和 需要被计算的枚举成员 computed
常量枚举成员
<br>
没有初始值的枚举成员
对已有枚举成员的引用
常量表达式
常量枚举成员 会<font color="#b71c1c"><b>在编译时 就计算出结果</b></font>,然后以常量的形式出现在 运行环境
需要被计算的枚举成员
一些非常量的表达式
需要被计算的枚举成员 在编译时 结果被保留,<b><font color="#b71c1c">在运行时才会被计算</font></b>
注意
在 computed 之后的枚举成员一定要赋值,否则会抛错
枚举类型与<br>枚举成员的类型<br>
在某些情况下,枚举和枚举成员都可以作为一种类型使用
枚举类型与枚举成员类型使用
1、枚举成员没有任何初始值
2、枚举成员都是数字类型<br>
3、枚举成员都是字符串类型<br>(整个枚举不能作为类型使用,只能使用枚举成员作为类型)<br>
两个枚举之间不可以进行比较
枚举合并
我们可以分开声明枚举,他们会自动合并
编译为 JavaScript 后的代码
any
声明为 any 的变量可以赋予任意类型的值。
unknown
unknown 是 TypeScript 3.0 引入了新类型,是 any 类型对应的安全类型。
void
某种程度上来说,void类型像是与any类型相反,它表示没有任何类型。<br>
例子
当一个函数没有返回值时,通常会见到其返回值类型是 void
声明一个void类型的变量没有什么用,因为只能为它赋予undefined和null
never
never 是其他类型的子类型,<b><font color="#b71c1c">代表不会出现的值</font></b>,没有类型可以赋值给never类型(除了never本身之外)<b><font color="#b71c1c"><br>即使 any也不可以赋值给never。</font></b><br>
例子
在函数内部永远会抛出错误,导致函数无法正常结束<br>
死循环,永远无法运行到的代码<br>
这行是为了好看凑数用的
0 条评论
下一页