小白晋级之路--TypeScript

一、ts语法中出现的问号

/* TypeScript
    当 product没有值的时候，不访问其 price属性，
	当 product有值的时候再去访问其 price属性
*/
product?.price 

二、...运算符

（1）展开运算符

let a = [1,2,3];
let b = [0, ...a, 4]; // [0,1,2,3,4]
 
let obj = { a: 1, b: 2 };
let obj2 = { ...obj, c: 3 }; // { a:1, b:2, c:3 }
let obj3 = { ...obj, a: 3 }; // { a:3, b:2 }

（2）剩余操作符

let a = [1,2,3];
let [b, ...c] = a;
b; // 1
c; // [2,3]
 
// 也可以
let a = [1,2,3];
let [b, ...[c,d,e]] = a;
b; // 1
c; // 2
d; // 3
e; // undefined
 
// 也可以
function test(a, ...rest){
  console.log(a); // 1
  console.log(rest); // [2,3]
}
 
test(1,2,3)

三、typescript中的class与interface的区别

typescript中声明一个类型，我们通常会有两种做法：
1.使用class

  export default class state {
    userInfo: {
        name: string,
        age: number
    }
}

2.使用interface

 export interface STATE {
    userInfo : {
        name: string,
        age: number
    }
}

那么这两种声明类型的方案有什么区别？

由于typescript的宗旨是兼容js，运行时要擦除所有类型信息，因此interface在运行时是会被完全消除的。而class经过编译后，在运行时依然存在。因此如果要声明的类型只是纯粹的类型信息，只需要声明interface即可。