Typescript解构、展开
什么是解构、展开？
展开与解构作⽤相反，简单来说：
解构：解构赋值允许你使⽤数组或对象字⾯量的语法，将数组和对象的属性付给各种变量。
展开：允许你讲⼀个数组展开为另⼀个数组，或⼀个对象展开为另⼀个对象。
1.
1. 数组解构
// 1.数组元素的赋值-JavaScript语法
var first=someArray[0];
var second=someArray[1];
var third=someArray[2];
/
/ 2.对⽐⼀下TypeScript、ES6提供简介、⾼效、可读的解构语法
var [first,second,third]=someArray;
// 3. 对任意深度的嵌套数组进⾏解构
var [foo,[[bar],baz]]=[1,[[2],3]];
console.log(foo);//1
console.log(bar);//2
console.log(baz);//3typescript 字符串转数组
// 4.忽略尾随元素
let [first]=[1,2,3,4];
console.log(first);//1
// 5 .忽略部分元素
let [,second,,forth]=[1,2,3,4];
console.log(second);//2
console.log(forth);//4
2. 对象解构　
// 1. 解构对象
let o={
a:'foo',
b:12,
c:'bar'
};
let {a,b}=o;
/
/ 2. 没有声明的赋值
({a,b}={a:'foo',b:12,c:'bar'});//注意此处，需要⽤括号括起来，因为javascript通常会以{起始的语句作为⼀个代码块。
// 3.对象⾥⾯可以使⽤ ... 语法创建剩余变量
let {a,...passthrough}=o;
let total=passthrough.length;
// 4. 属性重命名
let {a:newName1,b:newName2}=o;
//a:newName1读作“a作为newName1”，等价于⼀下写法：
let newName1=o.a;
let newName2=o.b;
// 5. 指定类型
let {a,b}:{a:string,b:number}=o;
// 6 .指定默认值(即使b为udefined，obj的属性a,b也都会有值)
function keepWhole(obj:{a:string,b?:number}{
let {a,b=1001}=obj;
});
3. 展开　
// 1. 数组展开
let first=[1,2];
let second=[3,4];
let all=[0,...first,...second,5];
console.log(all);//0,1,2,3,4,5
/
/ 2. 对象展开(属性值覆盖)
let default={ food:'spicy',price:'$',drink:'coko'};
let search={...default,food:'rich'};
console.log(search);//{food:'rich',price:'$',drink:'coko'}
// 3.对象展开：它只包含⾃⾝的可枚举的属性。并且会丢失展开对象的⽅法：
class C={p:12,m(){}};
let c=new C();
let clone={...c};
console.log(clone.p);//12
console.log(clone.m);//error!
      ___end

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。