ES6: 对象和数组解构
所谓解构,指的是将数据结构分解为更小的部分,从而使数据提取变得容易。
对象解构:
- 使用解构时,必须提供初始化值
[code lang=”js” collapse=”false”]
let Person = {
name: ‘sen’,
age: 18
}
let {name, age} = Person;
[/code] - 解构表达式的值为=右侧的值
- 如果对象中没有同名属性时,解构表达式新赋值的变量的值为undefined
- 解构对象只是赋值时,需要加()
- 赋值给不同名的变量
[code lang=”js” collapse=”false”]
let Person = {
name: ‘sen’,
age: 18
}
let {name: localName, age: localAge} = Person;
[/code] - 设置默认值
[code lang=”js” collapse=”false”]
let Person = {
name: ‘sen’,
age: 18
}
let {name, age: localAge = 18} = Person;
[/code] - 嵌套解构
[code lang=”js” collapse=”false”]
let Person = {
name: ‘sen’,
age: 18,
score: {
maths: 100
}
}
let {name, score: {maths}} = Person;
console.log(maths);
[/code]
数组解构
-
[code lang=”js” collapse=”false”]
let score = [99, 88, 77];
let [maths, english, chinese] = score;
[,,chinese] = score;
[/code] - 数组解构赋值不需要加()
[code lang=”js” collapse=”false”]
let a = 3;
let b = 4;
[a, b] = [b, a]
[/code] - 嵌套的解构
[code lang=”js” collapse=”false”]
let score = [99, 88, [77]];
let [,,[chinese]] = score;
[/code] - 剩余项
[code lang=”js” collapse=”false”]
let score = [99, 88, 77];
let [maths, …restScore] = score;
console.log(restScore) // [88, 77]
[/code] - 数组和对象可以混合解构
[code lang=”js” collapse=”false”]
let Person = {
name: ‘sen’,
age: [0, 18]
}
let {name: localName, age: [start]} = Person;
console.log(start);
[/code]
发表评论