柠檬小窝
解构赋值
ES6 引入了解构赋值（Destructuring Assignment），是一种从数组或对象中提取值并赋给变量的语法，使得在处理数据时更加方便和简洁。
当使用解构赋值时，我们可以从数组或对象中提取数据，并将其赋值给对应的变量。下面我将详细介绍数组解构和对象解构的用法，以及一些扩展功能。
TIP
解构赋值是一种简洁而强大的语法，它在处理数据时非常实用，使得代码更加清晰易读。无论是数组解构还是对象解构，都可以显著提高代码的可读性和可维护性。
数组解构赋值
数组解构赋值允许我们根据数组的顺序，将数组的元素提取出来并赋值给变量。
基本用法
javascript
const numbers = [1, 2, 3, 4, 5]
const [a, b, c, d, e] = numbers
console.log(a) // 1
console.log(b) // 2
console.log(c) // 3
console.log(d) // 4
console.log(e) // 5忽略不需要的元素
我们可以使用逗号将不需要的元素跳过。
javascript
const numbers = [1, 2, 3, 4, 5]
const [a, , c, , e] = numbers
console.log(a) // 1
console.log(c) // 3
console.log(e) // 5给变量指定默认值
如果数组元素不足以匹配变量的个数，可以为变量指定默认值，避免出现undefined。
javascript
const numbers = [1, 2]
const [a, b, c = 3] = numbers
console.log(a) // 1
console.log(b) // 2
console.log(c) // 3 (使用默认值)剩余元素
使用...语法可以将剩余的数组元素赋值给一个新数组。
javascript
const numbers = [1, 2, 3, 4, 5]
const [a, b, ...rest] = numbers
console.log(a) // 1
console.log(b) // 2
console.log(rest) // [3, 4, 5]交换变量的值
使用解构赋值，可以非常简洁地交换两个变量的值，无需使用第三个变量。
js
let x = 10
let y = 20
;[x, y] = [y, x] // 前面必须要加分号
console.log(x) // 20
console.log(y) // 10对象解构赋值
对象解构赋值允许我们根据对象的属性名，将对象的属性值提取出来并赋值给变量。
基本用法
javascript
const person = {
name: 'John',
age: 30,
country: 'USA'
}
const { name, age, country } = person
console.log(name) // 'John'
console.log(age) // 30
console.log(country) // 'USA'重命名变量
我们可以通过在解构时为变量指定新的名称，来实现重命名。
javascript
const person = {
fullName: 'John Doe',
yearsOld: 30
}
const { fullName: name, yearsOld: age } = person
console.log(name) // 'John Doe'
console.log(age) // 30给变量指定默认值
和数组解构一样，可以为对象解构赋值时，为变量指定默认值。
javascript
const person = {
name: 'Alice',
age: 25
}
const { name, age, country = 'Unknown' } = person
console.log(name) // 'Alice'
console.log(age) // 25
console.log(country) // 'Unknown' (使用默认值)嵌套解构
对象解构也支持嵌套解构，从嵌套对象中提取值。
javascript
const person = {
name: 'Bob',
age: 28,
address: {
city: 'New York',
country: 'USA'
}
}
const {
name,
age,
address: { city, country }
} = person
console.log(name) // 'Bob'
console.log(age) // 28
console.log(city) // 'New York'
console.log(country) // 'USA'