ES6以及TypeScript(TS)

1.ES6

1.let命令，let声明的变量只在它所在的代码块有效，for循环的计数器，就很合适使用let命令。let不允许在相同作用域内，重复声明同一个变量。

const声明一个只读的常量。一旦声明，常量的值就不能改变。对于const来说，只声明不赋值，就会报错，const的作用域与let命令相同：只在声明所在的块级作用域内有效。

const和let都有个暂时性死区的概念，暂时性死区，就是在声明之前，使用变量，会报错。

if (true) {`

console.log(MAX); // ReferenceError`

const MAX = 5;`

`}

如上图console.log(MAX);会报错

2.解构：从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。如下是数组的解构：

let [foo, [[bar], baz]] = [1, [[2], 3]];`

foo // 1`

bar // 2`

baz // 3`

let [head, ...tail] = [1, 2, 3, 4];`

head // 1`

tail // [2, 3, 4]`

对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。对象解构如下：

let { bar, foo } = { foo: 'aaa', bar: 'bbb' };`

foo // "aaa"`

bar // "bbb"`

let { baz } = { foo: 'aaa', bar: 'bbb' };`

baz // undefined`

2.TS

1.TS文件并不能直接编译，需要tsc命令将其改为JS文件，才能直接运行。TypeScript 会忽略程序中出现的空格、制表符和换行符，支持面向对象，定义变量格式为

var [变量名] : [类型] = 值;声明变量的类型，但没有初始值，变量值会设置为 undefined，对象定义如下

class Site { name():void { console.log("Runoob") } }

var obj = new Site(); obj.name();

2.any类型，很好理解any类型就是只可以是任何类型： var user : any = 1 ;

元组类型允许表示一个已知元素数量和类型的数组，各元素的类型不必相同。let tuple: [number, string] = [18, 'lin']

可选参数参数后加个问号，代表这个参数是可选的：function add(x:number, y:number, z?:number):number {return x + y }

add(1,2,3) //返回值是6

add(1,2) //返回值是3

1. number对象的方法

toFixed()把数字转换为字符串，并对小数点指定位数。

var num3 = 177.234 console.log("num3.toFixed() 为 "+num3.toFixed()) // 输出：177 console.log("num3.toFixed(2) 为 "+num3.toFixed(2)) // 输出：177.23 console.log("num3.toFixed(6) 为 "+num3.toFixed(6)) // 输出：177.234000

toLocaleString()把数字转换为字符串，使用本地数字格式顺序。

var num = new Number(177.1234); console.log( num.toLocaleString()); // 输出：177.1234。

toString()把数字转换为字符串，使用指定的基数。

4.interface是 TS 设计出来用于定义对象类型的，可以对对象的形状进行描述。如果希望某个属性不被改变，可以这么写：

interface Person { readonly id: number name: string age: number }

函数声明：(x: number): number，接收一个 number 类型的参数 x，并返回一个 number 类型的结果。

类：与Java的类相似，也有封装、继承和多态，简单的例子如下：

class Person {

name: string

age:number

//只能写一个构造函数，有很多的属性

constructor(name: string, age:number) {

this.name = name

this.age = age

}

speak() {

console.log(${this.name} is speaking and his age is ${this.age})

}

}

const p2 = new Person('lin',22) // 新建实例 ，会传入对应的类型的值，会按照顺序进行赋值

p2.name // 访问属性和方法

p2.speak()

也具有public、private、static、protected等修饰，效果也与java一样，static修饰静态属性，一些固定的常量值，abstract抽象类，不能被实例化。只能通过子类继承实例化。

而多态就是父类为抽象类，子类继承他，并且不同的实现父类的抽象方法。经典的例子如下：

abstract class Animal { constructor(name:string) { this.name = name } public name: string public abstract sayHi():void }

class Dog extends Animal { constructor(name:string) { super(name) } public sayHi() { console.log('wang') } }

class Cat extends Animal { constructor(name:string) { super(name) } public sayHi() { console.log('miao') } } 都实现了sayHi但是实现的内容不同。

枚举：TS 中我们使用 const 来声明常量，但是有些取值是在一定范围内的一系列常量，比如一周有七天，比如方向分为上下左右四个方向。

这时就可以使用枚举（Enum）来定义。

一个简单的枚举：

enum Direction { Up, Down, Left, Right }

联合类型：定义如下let num: number | string

num = 8 num = 'eight' 这样num就又可以是数字也可以是字符串

类型别名：type关键字

type Name = string //定义string类型的别名name type NameResolver = () => string //定义string类型的别名NameResolver ，没有参数返回值为string type NameOrResolver = Name | NameResolver // 前面两个的联合类型

//定义函数，名字:getName ,接受一个参数n,类型为NameOrResolver ,返回值为Name

function getName(n: NameOrResolver): Name { if (typeof n === 'string') { return n } else { return n() } }

泛型：泛型跟java的泛型相似，就是类似于占位符或者说是一个变量，使用的时候可以把定义的类型像参数一样传入，它可以原封不动地输出。

type使用泛型定义函数，例子如下

type Print = <T>(arg: T) => T //定义别名Print,类型为泛型T，返回值也是泛型T const printFn:Print = function print(arg) { console.log(arg) return arg } 箭头函数：举例子如下

// 定义一个接受一个参数的函数并返回这个参数的平方 const square = x => x * x;

// 定义一个接受两个参数的函数并返回它们的和 const sum = (x, y) => x + y;

// 定义一个没有参数的函数并输出一段文本 const sayHello = () => { console.log('Hello, world!'); };

ists.value = lists.value.filter(item => !item.done)//这里的箭头代表定义匿名函数，入参为item，返回值是item.done为false的所有item值