[JavaScript]解构赋值详解，2024前端春招面试真题详解

解构默认值

如果解构取出的值是undefined，可以设置默认值：

let a, b;

// 设置默认值

[a = 5, b = 7] = [1];

console.log(a); // 1

console.log(b); // 7

在上面的例子中，我们给a和b均设置了默认值

这种情况下，如果a或b的值是undefined，它将把设置的默认值赋给相应变量（5赋给a，7赋给b）

交换变量值

以往我们进行两个变量的交换，都是使用

//交换ab

c = a;

a = b;

b = c;

或者异或的方法

然而在解构赋值中，我们可以在一个解构表达式中交换两个变量值

let a = 1;

let b = 3;

//交换a和b的值

[a, b] = [b, a];

console.log(a); // 3

console.log(b); // 1

解构函数返回的数组

我们可以直接解构一个返回值为数组的函数

function c() {

return [10, 20];

}

let a, b;

[a, b] = c();

console.log(a); // 10

console.log(b); // 20

在上面的例子中，**c()**的返回值[10，20]可以在单独的同一行代码中使用解构

忽略返回值（或跳过某一项）

你可以有选择性的跳过一些不想得到的返回值

function c() {

return [1, 2, 3];

}

let [a, , b] = c();

console.log(a); // 1

console.log(b); // 3

赋值数组剩余值给一个变量

当你使用数组解构时，你可以把赋值数组剩余的部分全部赋给一个变量

let [a, …b] = [1, 2, 3];

console.log(a); // 1

console.log(b); // [2, 3]

这样的话b也会变成一个数组了，数组中的项是剩余的所有项

注意：

这里要小心结尾是不能再