正常赋值
let x = 0;
let y =1;
let [x, y] = [0, 1];// 解构赋值
本质上就是一种模式匹配
只要等号两边的模式相同,左边的变量就会被赋予相对应的值
let [a, , b] = [1, 2, 3];
console.log(b);// 按位置匹配
解构默认值
let [a = 100] = [, 1000];
console.log(a);
let obj = {
names: '张三',
age: 18,
sex: '女',
data: [1, 2, 3, 4],
say: function () {
console.log('你好,我是张三');
}
}
js写法
var name1 = obj.names;
var age1 = obj.age;
let {
age,
names,
say,
} = obj;
say();
console.log(names, age);
es6解构赋值,结构对象时,变量名必须和属性名相同,但是顺序没有要求
以对象的形式解构赋值
let arr = [1, 2, 3, 4, 5];
let {
[0]: a,
[4]: b,
} = arr;
let obj = {
data: [0, 1, 2],
}
当对象中含有数组时
let {
data,// 以变量取出相对应的值,变量名必须和属性名相同
data : arr,// 以属性名取出相对应键值对的值,并将值保存在变量arr中
data : [a, b, c],// 将上一步中的arr彻底解构
} = obj;
console.log(a);
console.log(b);
console.log(c);
当对象中含有数组,数组内又有对象
let obj = {
data: [{
age: 1,
}, {
names: 2,
}, ],
}
let {
data: [{
age
}, {
names
}, ]
} = obj
console.log(age, names);
解构赋值,解构字符串时,会将字符串当作一个数组来去解构
let str = 'Helloword';
let [a, b, c] = str;
let {
[0]: d
} = str;
console.log(a, b, c, d);