本文共 2285 字,大约阅读时间需要 7 分钟。
ES6中,按照一定的模式,从数组或对象中提取值,对变量进行赋值。这个过程叫做解构赋值。
const arr = ["诺手", "蝎子", "劫", "EZ", "女坦"]; let nuo = arr[0]; console.log(nuo);//诺手 //ES6--------------------------- / let [nuo, lailai, jie, ez, f] = arr;或 let [nuo,lailai,jie,ez,f] = ["诺手","蝎子","劫","EZ","女坦"]; / console.log(nuo);诺手
本质上,这种写法属于“模式匹配”。只要赋值号两边的模式相同,左边的变量就会被赋予对应的值。
let [a,[b,c]] = [1,[2,3]];console.log(b);//2let [a,,b] = [1,2,3];console.log(b);//3
不完全解构(赋值号两边不是完全相等的。)
let [a,b] = [1,2,3];console.log(a);//1console.log(b);//2
解构失败时,变量的值为undefined。
let [a,b] = [1];console.log(a);//1console.log(b);//undefined
const obj = { name:"亚索", skill:"hasakei"}let { name,skill} = obj;console.log(name);//亚索
变量名与属性名相同,才能取到正确的值。
如果想要自定义变量名,则用:进行修改。
const obj = { name: "亚索", skill: "hasakei" } var { name:yi, skill:er } = obj; console.log(yi);//亚索*/
方法解构
var obj = { r: function () { console.log("狂风绝息斩"); }, e: function () { console.log("e去不复返"); } } const { r, e } = obj; r();//狂风绝息斩 e();//e去不复返 /---方法解构自定义名 var { r: yi, e: er } = obj; yi();//狂风绝息斩 er();//e去不复返*/
注意点:
let x;{ x} = { x:1};
以上代码是错误写法。{x}
前面如果没有let const的变量声明的关键字,则js会将其视为代码块。
let x;({ x} = { x:1}); console.log(x);//1
const arr = ["诺手", "蝎子", "劫", "EZ", "女坦"]; var { length, 0: first, 4: last } = arr; console.log(length);//5 console.log(first);//诺手 console.log(last);//女坦
数组的本来我们用的方式
const arr = ["诺手", "蝎子", "劫", "EZ", "女坦"]; var [yi ,er] = arr; console.log(arr.length);//5 console.log(yi);//诺手
const str = 'hello';let [a, b, c, d, e] = str;console.log(a);//hlet { length } = str;console.log(length);//5
类数组的对象都有一个length
属性,我们可以对这个属性进行解构赋值。
function add([x, y]) { return x + y; } let sum = add([1, 2]); console.log(sum);//3
以上案例,函数add的参数表面上一个数组,但是在传入参数的那一刻,数组参数会被解构成变量x和与y.
let a = 1;let b = 2;/*原来写法 let tmp = a; a = b; b = tmp;8*/[a,b] = [b,a]; console.log(a);/2
function fn({ a,b,c}){ console.log(a);/1 console.log(b);/2 console.log(c);/3}fn({ c:3,b:2,a:1})
转载地址:http://tydyf.baihongyu.com/