在 ES6 中，解构赋值和默认参数是两个非常常用的语法。解构赋值可以使我们更方便地从数组或对象中取出需要的值，而默认参数则可以使我们在函数调用时更加灵活。
解构赋值
解构赋值可以让我们从数组或对象中取出需要的值，并将它们赋值给变量。以下是一个简单的例子：
// javascriptcn.com 代码示例
const arr = [1, 2, 3];
const [a, b, c] = arr;
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3
const obj = { x: 1, y: 2, z: 3 };
const { x, y, z } = obj;
console.log(x); // 1
console.log(y); // 2
console.log(z); // 3在上面的例子中，我们使用了数组和对象的解构赋值语法，将数组 [1, 2, 3] 中的值分别赋值给变量 a、b、c，将对象 { x: 1, y: 2, z: 3 } 中的值分别赋值给变量 x、y、z。
除了基本的解构赋值语法之外，ES6 还提供了一些高级的用法。例如，可以使用默认值：
// javascriptcn.com 代码示例
const arr = [1, 2];
const [a, b, c = 3] = arr;
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3
const obj = { x: 1, y: 2 };
const { x, y, z = 3 } = obj;
console.log(x); // 1
console.log(y); // 2
console.log(z); // 3在上面的例子中，我们使用了默认值语法。如果变量在解构过程中没有找到对应的值，那么它们将被赋予默认值。
此外，还可以使用嵌套解构：
// javascriptcn.com 代码示例
const arr = [1, [2, 3], 4];
const [a, [b, c], d] = arr;
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3
console.log(d); // 4
const obj = { x: 1, y: { z: 2 } };
const { x, y: { z } } = obj;
console.log(x); // 1
console.log(z); // 2在上面的例子中，我们使用了嵌套解构语法。这使得我们可以从嵌套的数组或对象中取出需要的值。
默认参数
默认参数可以在函数定义时为参数设置默认值。以下是一个简单的例子：
function greet(name = 'World') {
console.log(`Hello, ${name}!`);
}
greet(); // Hello, World!
greet('John'); // Hello, John!在上面的例子中，我们定义了一个名为 greet 的函数，并为它的参数 name 设置了默认值 'World'。如果在函数调用时没有传递参数，那么 name 将被赋值为默认值 'World'。
默认参数也可以使用表达式：
function add(a, b = a + 1) {
return a + b;
}
console.log(add(1)); // 3
console.log(add(1, 2)); // 3在上面的例子中，我们定义了一个名为 add 的函数，并为它的参数 b 设置了默认值为 a + 1。这使得我们可以在函数调用时只传递一个参数，而不必担心参数 b 的值是什么。
总结
解构赋值和默认参数是 ES6 中非常有用的语法。它们可以使我们更方便地从数组或对象中取出需要的值，并在函数调用时更加灵活。在实际开发中，我们应该尽可能地使用这些语法，以提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/657e3dd6d2f5e1655d90ea89