TypeScript 变量声明

Question

1. 解构

要尽小心使用解构，当存在深层嵌套，加上重命名 ，默认值和类型注解时，将会变得难以理解

作用于函数参数

// 即类型是写在后面的, [number,number]
const input = [1,2]
function f([first,second]: [number,number]) {
    console.log(first)
    console.log(second)
}
f(input)

// 函数参数类型 {a:number}
const input = {a:1}
function f({a} : {a:number}) {
    console.log(a)
}
f(input)

2. 属性重命名

const o = {
    a: 1,
    b:'2'
}

const {a, b} = o;

// 属性重命名
const {a:c, b:d} = o;

即此时冒号后面的 c 和 d 是属性重命名，而不是指明类型，如果想指明类型:

const {a:c, b:d}:{a:number, b:string} = o;

3. 默认值

// 此时 {a:number, b: 'string'} 为类型声明，并不是解构
function keep(obj: {a:number, b: 'string'}) {
    const {a, b} = obj;

}

keep({a:1,b:'2'})

4. 展开

const default = {a:1,b:2}

const new = {...default, a:3}  // {a:3,b:2}

但是，对象展开只包含对象的自身可枚举属性，因此当展开对象实例时，会丢失方法:

class C {
    p = 1；
    m() {

    }
}

等同于

class C {
    constructor(){
        this.p = 1;
    }
    m() {

    }
}

// {p:1}, 因此此时 m 属性位于 C.proptype 上，不能展开得到
const c = {... new C()}