10月上旬学习笔记(ES新特性，TS，JS性能优化)ES新特性：juejin.im/post/688341…js代码优化

第二部分:TypeScript

一：TypeScript快速上手

安装：yarn add typescript --dev
执行：yarn tsc 文件名
执行完会在指定目录生成一个同名的js文件

二：TypeScript配置文件

安装配置文件：yarn tsc --init 安装完成后目录会多一个tsconfing.json文件
有配置文件后就可以提供yarn tsc执行文件

三：TypeScript原始类型

//原始数据类型
//在非严格模式string-number-boolean允许为空(undefined)或者null
const a: string = 'string'
const b: unmber = 10000
const c: boolean = false
//空值类型一般在函数没有返回值,在非严格模式下可以是null
const d: void = undefined
const e: null = null
const f: undefined = undefined

//使用Symbol错误，因为标准库找不到对应的类型不认识，需要配置标准库选项
复制代码

四：TypeScript标准库声明

在ts文件中使用ES2015的内置对象是会找不到对象的类型，因为TS的编制库使用的是ES5的，所以找不到对应的类型
解决方法（打开之前安装的配置文件）
方案一：修改配置文件的target选项为ES2015
方案二：打开配置文件的lib选项并且在[]中写入ES2015 -> ['ES2015']
由于打开了lib配置选项，所以导致了bom,dom对象使用不了了，所以还需要配置上，由于dom和bom标准库结合了，所以只需要配置上dom即可 -> 'lib' : ['ES2015' , 'DOM']

五：TypeScript中文错误消息提示

yarn tsc --locale zh-CN
在下次执行文件如果报错，提示消息就是中文的了

六：TypeScript-Object类型

const foo: object = {}  //可以是对象，数组，函数

//普通对象--规定特定成员
const obj:{foo : number , bar : string} = {foo : 123 , bar : '123'}
复制代码

七：TypeScript-Array类型

const arr1 : Array<number> = [1,2,3,4,5,6]
const arr2 : number[] = [1,2,3,4,5,6]

//小案例
function sum(...agrs : number[]){
return args.reduce((prev, current) => prev + current)
}
复制代码

八：TypeScript-元组(tuple)类型

const tuple:[number, string] = [10, 'xjq']
const age = tuple[0]
const name = tuple[1]
const [age1, name2] = tuple
复制代码

九：TypeScript-枚举类型

关键字：enum

十：TypeScript-函数类型

//可选参数---在参数后面添加一个问号，必须写在最后面
function func1(a: number , b?: number): string {
return 'func1'
}

//也可以添加参数默认值，但是必须写在最后面
function func2(a: number , b: number = 10): string {
return 'func2'
}

//任意参数个数
function func3(...agrs: number[]): string {
return 'func3'
}

//函数表达式
const func4: (a: number, b: number) => string = function(a: number , b:number): string {
return 'func4'
}
复制代码

十一：TypeScript-任意类型

//any类型不安全
function stringify(value: any){
return JSON.stringify(value)
}
stringify('string')
stringify(100)
stringify(false)
复制代码

十二：TypeScript-类型断言

关键字：as

十三：TypeScript-接口（interface）

关键字：interface
可选成员：?
可读成员：readonly
动态成员：[key: type] : type

十四：TypeScript-Class的使用

公共属性：publlic
私有属性：private
受保护的属性：protected
private和protected的区别：第一个不能再子类中访问，第二个可以在子类中访问
可读属性：readonly

十五：TypeScript-类与接口

关键字：implements

十六：TypeScript-抽象类

关键字：abstract
abstract抽象类只能被继承，不能被创建实例

十七：TypeScript-泛型

泛型就是定义的时候不声明类型，等到使用的时候再去声明类型--目的是最大程度的使用定义的方法
关键字：T

十八：TypeScript-类型声明

比如在使用第三方库的时候，没有类型声明，需要自己声明
如果第三方库有类型声明模块，则安装模块
关键字：declare