使用TS的一些基础知识

简介: 使用TS的一些基础知识

首先 js是一个弱类型语言 所以编写起来会非常的灵活  但是在开发大型项目时候呢  用js由于过于灵活 ,所以在后期维护的过程中可能会出现各种各样的问题 所以ts就出现了

      ts拥有三种类型校验

                       1. 类型推断  这种是ts自带的 例如我们在刚开始定义变量时 给变量赋值 例如 我给str = ‘123’ 给他设置成为 字符串形式 那么ts会认为 你的str变量就是一个字符串变量 那么在后期使用的时候 如果你将这个变量修改为不是字符串变量时 就会报错  这是为了防止 这个变量在后期使用字符串方法时 但修改为了其他类型而出现错误

                       2. 类型注释 这种则是在定义变量的时候给变量标注上是什么类型  例如 let a:number;         let a:string = '123' ; 这种设置则可以在定义变量还未赋值的时候就给变量规定好了是什么类型的变量

                       3. 类型断言 类型断言一般在  

a7fcc81364c34003a24f38f15865adc5.png

上边这种情况 为什么 result会报错呢 是因为 在系统自动类型推断的时候 他推断你的result这个值 可能会出现undefind情况 是因为类型推断他会认为你的数组中可以会有非数字类型 因为例如我确定我们的数组中都是数字 那么我们就可以用断言来 人工干预的形式 去设置一个 as number就可以了


       联合类型

               可以让我们的变量可以设置多种类型中的一种 或是多个值中的一个值 例如

               let v1:string | number = '123' | 123  则表示v1这个变量可以设置为数值或者是字符串类型

               let v2 : 1 | 2 | 3 = 5 这种则表示 这个v2变量 只能是 1,2,3这三个值中的一种 而我写的这种=5则就会报错  

741bea9f10d348278e0206b747024f27.png


        数组类型约束:

                       两种书写方式

                        1. let arr1:number[] = [1,2,3,4,5] 则表示是一个数值的数组 如果数组中有非数值类型则会报错

                        2. let arr2:Array<string> = [ '1','2','3','4' ] 这种格式则会表示一个数组内的值为字符串  两种写法都OK

d2a8383328ff4aaaaf1f512b3060ecbe.png


       元组类型:

              let t1:[number,string,boolean] = [ 1,' 2 ', true ] 元组并不是只有固定的数值 也可以设置非固定的   我们可以通过下标获取值或进行修改 但是修改也必须按照定义的类型进行修改 也就是说 t1[0] 这个值是一个number类型 则只能设置为number 如果设置为string类型就会报错

              let t2:[number,string,number?] = [ 1, ' 2 ' ] 那么最后的第三个参数number就是可写可不写(可选填参数)

5d50227bd2a64475b41c9fcc98bb2e44.png

    枚举类型: 未完待续。。。


最后 如果想练习ts的语法 可以去 TypeScript: 学习 TypeScript 的起点 (typescriptlang.org) 这里面的演练场去练习 里面可以选择TS的版本和配置等可以调换 并且写完就可以在右侧看到运行结果

相关文章
|
15小时前
|
JavaScript 前端开发 API
第9期 一文读懂TS的(.d.ts)文件
第9期 一文读懂TS的(.d.ts)文件
53 0
|
7月前
|
Java 编译器
TS的重新学习(三)
TS的重新学习(三)
25 0
|
7月前
|
JavaScript Java 编译器
TS的重新学习(二)
TS的重新学习(二)
29 0
|
JavaScript 前端开发 API
一文读懂TS的(.d.ts)文件
一文读懂TS的(.d.ts)文件
3858 0
|
9月前
|
JavaScript 前端开发
TS基础语法
TypeScript(缩写为TS)是一种静态类型的JavaScript超集,它为JavaScript添加了类型注解和其他扩展功能。下面是TypeScript的基础语法
|
15小时前
ts笔记
ts笔记
|
15小时前
|
JavaScript 前端开发 编译器
ts面试题总结
ts面试题总结
75 0
|
6月前
|
JavaScript 前端开发 开发者
ts知识点
ts知识点
32 0
|
7月前
|
JavaScript 前端开发 开发工具
CocosCreator 面试题(五)TS有什么优缺点?为什么要用TS?
CocosCreator 面试题(五)TS有什么优缺点?为什么要用TS?
104 0
|
8月前
|
JavaScript 索引
ts - 类 进阶2
ES7类的使用