如何在 ECMAScript 2021 中使用解构获取对象的默认值？

在 ECMAScript 2021 中，我们可以使用解构获取对象的默认值，这在开发中将会非常有用。在这篇文章中，我们将讨论如何在 ECMAScript 2021 中使用解构获取对象的默认值。

解构对象

在 ECMAScript 2015 中，我们可以使用解构来获取对象的值。这个特性可以让我们轻松地从对象中提取数据。

const person = { name: "Tom", age: 25 };
const { name, age } = person;
console.log(name); // "Tom"
console.log(age); // 25

上述代码中，我们使用解构从 person 对象中提取了 name 和 age 属性的值。

解构默认值

但是，当对象中没有我们要解构的属性时，我们将会遇到问题。

const person = { name: "Tom" };
const { age } = person;
console.log(age); // undefined

上述代码中，我们试图从 person 对象中获取 age 属性的值，但是由于 person 对象中不存在 age 属性，所以我们得到了 undefined。

解构获取默认值

在 ECMAScript 2021 中，我们可以使用解构获取对象的默认值。如果对象中不存在我们要解构的属性，我们可以设置一个默认值。

const person = { name: "Tom" };
const { age = 25 } = person;
console.log(age); // 25

上述代码中，我们使用解构从 person 对象中获取 age 属性的值。由于 person 对象中不存在 age 属性，我们设置了默认值为 25。

实际应用

解构默认值在开发中非常有用，特别是在函数参数列表中。

function greet({ name = "World", greeting = "Hello" } = {}) {
  console.log(`${greeting}, ${name}!`);
}

greet(); // "Hello, World!"
greet({ name: "Tom" }); // "Hello, Tom!"
greet({ name: "Tom", greeting: "Hi" }); // "Hi, Tom!"

上述代码中，我们定义了一个 greet 函数，它获取一个对象参数。如果该对象缺失或者属性不存在，则设置默认值为一个空对象。我们可以轻松地在函数参数列表中使用解构默认值。

结论

在 ECMAScript 2021 中，我们可以使用解构获取对象的默认值。这个特性在解构中非常有用，特别是在函数参数列表中。我们可以轻松地设置默认值，以便我们的代码不会因为缺失属性而崩溃。

希望这篇文章对您有所帮助！

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/676e46213117be5a111f50a2