您能解释一下下面两个 javascript 代码片段之间的区别吗？答案

【问题标题】：Can you explain the diffrence between two javascript code snippets below?您能解释一下下面两个 javascript 代码片段之间的区别吗？
【发布时间】：2021-07-23 15:00:49
【问题描述】：

我被要求写一段代码，将传入的对象的所有键值对反转。这就是我写的。

invert(object){
   let newObj = {};
   
   for(let key in object){
      const original = object[key];
      newObj = {original : key}
   }
   
   return newObj;        
}

显然，这很有效（我不知道为什么）。问题的答案是

invert(object){
   let invertedObject = {};
   
   for(let key in object){
      const originalValue = object[key];
      invertedObject = {originalValue : key}
   }
 
   return invertedObject;
}

当与测试文件一起运行时，我的代码在答案代码通过时失败。推理是我的返回未定义。

测试错误代码：

失败：_.invert({originalKey: "originalValue"})["originalValue"]) 返回 undefined 而不是 originalKey

【问题讨论】：

标签： javascript object key-value

【解决方案1】：

区别在于以下语句：

newObj = {original : key}

在您的代码中，当您在newObj 中使用original 作为键时，而不是使用original 变量的值作为键时，'original' 按字面意思用作键。

original 变量在您的代码中未使用。

您可以通过使用计算属性名称来解决问题：

newObj = { [original]: key };

不使用计算属性，newObj 将是：

{
   original:"originalKey"
}

但使用计算的属性名称，newObj 将是：

{
   originalValue:"originalKey"
}

第二个代码示例有效，因为在以下语句中

invertedObject = {originalValue : key}

他们使用originalKey 的值作为键名。所以返回对象的键是'originalValue'。

还要注意第二个代码示例中的以下语句

const originalValue = object[key];

是不必要的，因为没有使用 originalValue 变量。第二个代码示例在没有上述语句的情况下也可以工作。

如果第二个代码示例使用计算属性名称为：

invertedObject = { [originalValue] : key }

那么您需要声明originalValue 变量的语句。

就我个人而言，我认为第二个代码示例很容易出错并且很容易被破解；它也不适用于制作可重用的功能，因为：

传递给此函数的对象并不总是只有一个键
您并不总是知道对象中每个键的值，即使您知道值，如果对象有多个键，这种方法也行不通

您应该使用计算属性名称，它不依赖于变量名称与对象中键的值相同。

【讨论】：

【解决方案2】：

从传入的对象中反转所有键值对

您必须将每个属性添加到同一个对象，而不是为每个属性创建新对象。

function invert(object) {
  let newObj = {};
  for(let key in object){
      const original = object[key];
      newObj[original] = key;  // add property to same 'newObj' object
  }
      return newObj;        
}

console.log(invert({originalKey: "originalValue", anotherKey: "anotherValue"}))

【讨论】：