TypeScript Start
Typescript是什么
Typescript是JavaScript的超集,支持es6写法,支持面向对象的概念,如继承,泛型等,ts并不是直接在浏览器上运行的,而是需要编译器编译成纯js来运行
TS与JS的区别
Typescript | JavaScript |
---|---|
.ts | .js |
支持ES6 | 不支持ES6 |
支持强类型和静态类型 | 不支持强类型和静态类型 |
编译时报错 | 运行时报错 |
支持面向对象概念,如对象,继承,泛型等 | 是一门脚本语言 |
支持模块 | 不支持模块 |
支持泛型 | 不支持泛型 |
Typescript优缺点
优点:
1.快速简单,易于学习;
2.编译时报错提供错误检查,在代码运行前报错;
3.支持所有的js库;
4.支持ES6写法;
5.使用继承提供可重用性;
6.使用定义模块来定义命名空间;
7.有助于代码结构
缺点:
编译花费时间较长
Typescript基础类型
1.number
2.string
3.boolean
4.Symbol
5.Array
6.Tuple(元祖)
7.enum(枚举)
8.object
9.never(用不存在的值类型)
10.void(没有任何类型,函数没有返回值时使用void)
11.null和undefined
12.any
安装
npm install -g typescript
项目初始化
tsc -v //查看typescript版本,判断是否安装成功
tsc --init //初始化
编译
tsc xx.ts
将多个ts文件合并成一个js文件
tsc --outfile compact.js file1.ts file2.ts file3.ts
自动编译ts文件并实时修改
tsc --watch file.ts
TS接口 以及特性
ts的核心原则之一就是对值所具有的结构进行类型检查
特点:
1)定义数组,函数,类,对象 等
2)接口可以相互继承
3)接口可以继承类
4)可选属性和额外检查
TS 调用基类中的构造函数和实现类的继承
super() //调用父类无参构造函数
extends
Typescript 模块
内部模块都称为命名空间,外部模块简称为模块
模块在自身的作用域里执行,并不是全局作用域。这就意味着模块类的类、函数、对象等对外都是不可见的。除非你通过export导出,import导入
装饰器
装饰器是一种特殊类型的声明,它能被附加在方法,类,函数,参数上.
装饰器使用@expression这种方式,expression求值后必须为一个函数,它在运行时调用,被装饰器声明的信息作为参数传入。
什么是Mixins
一种个通过组件构造类的方法
不通过类的直接继承来实现,而是将基类作为接口来实现。对于基类实例化部分在子类中实现,基类中原型的部分在子类中进行声明占位,然后通过一个Minxin函数将基类上的原型属性拷贝到子类上
TSD
TSD是Typescript的包管理工具
npm install tsd -g tsd init tsd query 第三方库 --action install
declare关键字
我们在.ts中使用的第三方库没有.d.ts文件的时候,可以使用过declare来写声明文件
可以声明该模块,甚至可以直接声明一个any类型的同名变量,然后我们就可以在代码中直接使用该第三方库了
.ts文件直接生成相应的.d.ts声明文件
tsc declaration test.ts
tsconfig.json文件的作用
通过配置该文件的相关配置选项告诉编译器如何编译ts文件
Typescript的泛型,作用
泛型代表的是泛指某一类型,更像是一个类型变量,由尖括号好过
主要作用是创建可复用的组件,泛型可以作用在函数,类,接口上.
函数: function greet<T>(name:T){} 类: class createObj<T>{ name:T } 接口: inteface HELLO<T>{ name:Number } 泛型约束之类型参数 function create<T,K extends keyof T>(obj:T,key:K){ return obj[key]; }
Typescript映射文件
.map映射文件
它是编译后的.js文件与源文件之间的映射文件,调试器使用该文件,使得我们在调试时调试的是ts文件而不是编译后的js文件
类型断言
表示断言的两种形式:
1.<类型>变量
2.变量 as 类型 (在tsx中只能使用这种方式)
类型断言对运行并没有什么影响,仅供编译器使用
枚举
枚举可以使我们定义一些带名字的常量,用于清晰表达意图和创建一组又区别的用例.
主要分为两类:
1.基于数字的.有自增长和反向映射的特性;
2.基于字符串的.
3.混合两种的异构枚举
rest参数
在不使用arguments对象的情况下允许我们的函数传递可变数量的参数的另一种实现方式.表达方式是...params
rest参数的规则;
1.一个函数只能有一个rest参数;
2.参数列表的最后一个参数;
3.必须是数组