ES6的解构赋值

解构赋值可以让我们的代码更加简洁明了，大大减少我们的代码量
解构赋值可以分为数组解构，对象解构，字符串解构

不使用对象解构的情况：

const person = {
  name: 'little bear',
  age: 18,
  sex: '男'
}
let age = person.age
let name = person.name
let sex = person.sex

而使用对象解构之后，以上的代码就可以变成下面的形式：

const person = {
  name: 'little bear',
  age: 18,
  sex: '男'
}
let { name,age,sex } = person

对象解构的书写方式：

let {a,b} = {a:'值a',b:'值b'};
console.log(a + '|' + b);    //值a|值b

对象解构没有次序之分：

let {a,b} = {b:'值b',a:'值a'};
console.log(a + '|' + b);    //值a|值b

如果在对象解构前就已经定义了变量，那么解构就会报错：

let a;
{a,b} = {b:'值b',a:'值a'};
console.log(a + '|' + b);    //报错（Unexpected token =）

上方的代码如果想不报错，只要在对象解构的外面加上一个（）就可以了：

let a;
({a,b} = {b:'值b',a:'值a'});
console.log(a + '|' + b);    //值a|值b

以前的变量赋值方式：

let a = 1;
let b = 1;
let c = 1;

用数组解构赋值的方式就可以将上方的代码变为：

let [a,b,c] = [1,1,1];

数组解构的两边格式要一致，如下的形式就会报错：

let [a,[b],c] = [1,1,1];
console.log(a + '|' + b + '|' + c);    //报错( [1,1,1] is not iterable)

将上面的形式改成如下格式就可以了（保证数组两边形式一致）：

let [a,[b],c] = [1,[1],1];
console.log(a + '|' + b + '|' + c);    //1|1|1

数组解构与对象解构不同，数组解构是有次序之分的：
let [a,b] = [1,2];和let [b,a] = [2,1]的a，b的值前后是不一样的

解构是可以有默认值的：

let [a,b=1] = [2];
console.log(a + '|' + b);    //2|1

而如果是以下的形式：(与函数的默认参数类似)

let [a=1,b] = [2];
console.log(a + '|' + b);    //2|undefined

默认值中undefined和null的区别：

//undefined相当于没有写，所以b是默认值
let [a,b=2] = [2,undefined];
console.log(a + '|' + b);    //2|2

//null相当于写值了，值就是null
let [a,b=2] = [2,null];
console.log(a + '|' + b);    //2|null

let [a,b,c] = 'ES6';
console.log(a + '|' + b + '|' + c);    //E|S|6

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。