如何动态分配对象中键的名称？

Question

const key = 'name'

const tempObj = {key: 'shiyuq'}

console.log(tempObj)

// {key: 'shiyuq'}

// but I want a object like this  {name: 'shiyuq'}

最后我找到了一种修改对象键值的新方法，代码如下：

const tempObj = {[key]: 'shiyuq'}

console.log(tempObj)

我想知道为什么这会起作用，在这种情况下[ ]是什么意思？谢谢！

Answer 1

计算属性名称从 ECMAScript 2015 开始，对象初始值设定项语法也支持计算属性名称。这允许您将表达式放在括号[]中，该表达式将被计算并用作属性名称。这让人想起属性访问器语法的括号表示法，您可能已经用它来读取和设置属性。现在你也可以在对象字面量中使用类似的语法：// Computed property names (ES2015)let i = 0let a = {  ['foo' + ++i]: i,  ['foo' + ++i]: i,  ['foo' + ++i]: i}console.log(a.foo1) // 1console.log(a.foo2) // 2console.log(a.foo3) // 3let param = 'size'let config = {  [param]: 12,  ['mobile' + param.charAt(0).toUpperCase() + param.slice(1)]: 4}console.log(config) // {size: 12, mobileSize: 4}从 -> 对象初始化器复制和粘贴- JavaScript | MDN

Answer 2

它被称为Computed Property Names，它使用括号表示法（方括号）[]实现例子：{ [variableName] : someValue }从 ECMAScript 2015 开始，对象初始值设定项语法也支持计算属性名称。这允许您将表达式放在括号 [] 中，该表达式将被计算并用作属性名称。对于 ES5，试试这样的var yourObject = {};yourObject[yourKey] = "yourValue";console.log(yourObject );例子：var person = {};var key = "name";person[key] /* this is same as person.name */ = "John";console.log(person); // should print  Object { name="John"}

Answer 3

伟大的。希望您清楚使用[ ]表示法。但是要在实时场景中工作，我们可以获得大量动态格式的对象数据，而不是一次一个键。我创建了一个代码片段，它基本上以更高级的方式扩展了您的答案，其中包含一组对象数据。示例：-第 1 步：让我们创建一个键的对象，即keysObj第 2 步：让我们创建一个临时对象，即tempObjStep-3 : 最后创建变量函数，即mainObjconst keysObj = {key1: "firstName", key2: "lastName"}; const tempObj = {key1: "Naheed", key2: "Shareef"};const mainObj = Object.keys(tempObj).reduce((obj,k) => Object.assign(obj, { [keysObj[k]]: tempObj[k]  }),{});console.log(mainObj);网址： https ://es6console.com/kc652vic/