1. 解构赋值:
ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。
1.1 解构赋值:
- 可以从数组中提取值,按照对应位置,对变量赋值。
- 本质上属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。
let [a, b, c] = [1, 2, 3];
1.2 常见解构:
1. 默认解构
let [a = 100] = [,1000];
console.log(a);
2. 对象的解构
- es6 解构对象是 变量名必须和属性名相同 但是顺序没有要求。
let obj = {
names:'张三',
age : 18,
sex : '女',
data :[1,2,3,4,5],
say : function(){
console.log('你好我是张三');
}
}
// es5 :
// var name = obj.name;
// var age = obj.age;
// 1. 解构对象中的变量
let {names,age,say} = obj;
console.log(names,age);
// 2. 解构对象中的方法
say();
- 解构对象中的数组
let obj = {
data, // 以变量 取出相对应的键值的变量名必须和属性名相同
data : arr, // 以属性命取出相对应的键值对的值 并将值保存在 变量arr中
data :[1,2,3,4,5], // 将上一步中的 arr 彻底解构
}
let {
data : [a,b,c]
} = obj;
console.log(a);
console.log(b);
console.log(c);
- 以对象形式 解构数组
let arr = [1,2,3,4,5];
let {
[0]:a,
[4]:b,
} = arr;
- 当对象中含有数组, 数组中又含有对象 -- json对象。
let obj = {
data: [{
age: 1,
}, {
names: 2
},],
}
let {
data: [{age}, {names}],
} = obj;
console.log(age, names);
- 解构字符串时 会将字符串当做一个数组 来取解构
let str = 'helloword';
console.log(str);
let [a,b,c] = str;
let {
[0] : d,
} = str;
console.log(a,b,c,d);