如何在 JavaScript 中声明具有计算属性名称的对象？

在 JavaScript 中，我们可以使用对象来存储和操作数据。而有时候，我们需要具有计算属性名称的对象来满足更为复杂的需求。本文将介绍如何在 JavaScript 中声明这样的对象。

什么是计算属性名称？

计算属性名称（Computed Property Names）在 ECMAScript 2015 中被引入，可以让我们根据表达式来计算属性名。这种属性名不需要使用引号，可以直接写在对象的大括号内部，并且可以使用方括号来包裹一个表达式。

例如，下面的代码利用计算属性名称来为一个对象动态添加属性：

const obj = {
  foo: 'bar',
  ['hello' + 'world']: 42,
};

console.log(obj); // { foo: 'bar', helloworld: 42 }

如何声明具有计算属性名称的对象？

我们可以使用两种方式来声明一个具有计算属性名称的对象。

对象字面量

对象字面量是一种使用大括号 {} 来声明对象的方式，在其中使用计算属性名称同样非常简单。

const key = 'hello';
const obj = {
  foo: 'bar',
  [key + 'world']: 42,
};

console.log(obj); // { foo: 'bar', helloworld: 42 }

Object.defineProperty 方法

Object.defineProperty 方法可以让我们为一个对象定义新的属性或修改原有属性的特性。在这个方法中，我们可以使用计算属性名称来定义属性。

const obj = {};

const key = 'hello';

Object.defineProperty(obj, key + 'world', {
  value: 42,
  enumerable: true,
  writable: false,
  configurable: false,
});

console.log(obj); // { helloworld: 42 }

在上面的代码中，我们使用 Object.defineProperty 方法为一个空对象定义了一个具有计算属性名称的属性。这个属性的特性包括了 value、enumerable、writable 和 configurable。

总结

通过本文，我们了解了什么是计算属性名称，并学会了如何在 JavaScript 中声明具有计算属性名称的对象。使用这种方式，我们可以更加灵活地创建对象，并适应更为复杂的需求。