【问题标题】:How do I convert array of Objects into one Object in JavaScript?如何在 JavaScript 中将对象数组转换为一个对象?
【发布时间】:2013-11-21 09:03:58
【问题描述】:

我有一个对象数组:

[ 
  { key : '11', value : '1100', $$hashKey : '00X' },
  { key : '22', value : '2200', $$hashKey : '018' }
];

如何通过 JavaScript 将其转换为以下内容?

{
  "11": "1100",
  "22": "2200"
}

【问题讨论】:

标签: javascript


【解决方案1】:

微型 ES6 解决方案可能如下所示:

var arr = [{key:"11", value:"1100"},{key:"22", value:"2200"}];
var object = arr.reduce(
  (obj, item) => Object.assign(obj, { [item.key]: item.value }), {});

console.log(object)

另外,如果你使用对象传播,它可能看起来像:

var object = arr.reduce((obj, item) => ({...obj, [item.key]: item.value}) ,{});

另一种速度提高 99% 的解决方案是(在 jsperf 上测试):

var object = arr.reduce((obj, item) => (obj[item.key] = item.value, obj) ,{});

这里我们受益于逗号运算符,它计算逗号之前的所有表达式并返回最后一个(在最后一个逗号之后)。所以我们不会每次都复制obj,而是给它分配新的属性。

【讨论】:

  • 喜欢这个! var object = arr.reduce((obj, item) => (obj[item.key] = item.value, obj) ,{});
  • 这一行更快还是传统循环?
  • @Jeb50,常规循环是最快的,但与逗号运算符相比并没有多少。 Object.assign/spread 运算符要慢一个数量级:jsperf.com/comma-operator-js
  • 你忘了传播第二个对象({...obj, ...{[item.key]: item.value}}) ,{});
  • 谢谢,实际上不需要将它包装在一个对象中。我已经修好了。
【解决方案2】:

尝试在How do I convert array of Objects into one Object in JavaScript? 中修复this answer

应该这样做:

var array = [
    {key:'k1',value:'v1'},
    {key:'k2',value:'v2'},
    {key:'k3',value:'v3'}
];
var mapped = array .map(item => ({ [item.key]: item.value }) );
var newObj = Object.assign({}, ...mapped );
console.log(newObj );


单线:
var newObj = Object.assign({}, ...(array.map(item => ({ [item.key]: item.value }) )));

【讨论】:

  • 非常感谢,这是优化一切的一行 :)
  • 非常感谢!这应该是 2021 年公认的答案。也许@vijay-chouhan 可以接受。
【解决方案3】:

您可能正在寻找这样的东西:

// original
var arr = [ 
  {key : '11', value : '1100', $$hashKey : '00X' },
  {key : '22', value : '2200', $$hashKey : '018' }
];

//convert
var result = {};
for (var i = 0; i < arr.length; i++) {
  result[arr[i].key] = arr[i].value;
}

console.log(result);

【讨论】:

【解决方案4】:

我喜欢完成这项任务的函数式方法:

var arr = [{ key:"11", value:"1100" }, { key:"22", value:"2200" }];
var result = arr.reduce(function(obj,item){
  obj[item.key] = item.value; 
  return obj;
}, {});

注意: 最后一个{} 是reduce 函数的初始obj 值,如果您不提供初始值,则将使用第一个arr 元素(这可能是不可取的)。

https://jsfiddle.net/GreQ/2xa078da/

【讨论】:

  • 如果密钥是动态的?
  • 嗯,你应该知道给定项目/对象的哪个属性应该用作键,哪个作为值?但是,如果我们假设 wfirst prop 始终是 key 而 second 是 value,我们可以使用这样的回调函数: function(obj,item){ var keys = item.keys(); obj[item[keys[0]]] = item[keys[0]];返回对象; }
  • 以上回调的更正:代码 var obj = arr.reduce(function(obj,item){ var keys = Object.keys(item); obj[item[keys[0]]] = item [keys[1]]; 返回 obj; },{});
【解决方案5】:

使用Object.fromEntries:

const array = [
    { key: "key1", value: "value1" },
    { key: "key2", value: "value2" },
];

const obj = Object.fromEntries(array.map(item => [item.key, item.value]));

console.log(obj);

【讨论】:

  • 这比Array.map解决方案imo更简洁易读
【解决方案6】:

使用现代 JavaScript 的简洁方法如下:

const array = [
  { name: "something", value: "something" },
  { name: "somethingElse", value: "something else" },
];

const newObject = Object.assign({}, ...array.map(item => ({ [item.name]: item.value })));

// >> { something: "something", somethingElse: "something else" }

【讨论】:

    【解决方案7】:

    使用lodash

    const obj = _.keyBy(arrayOfObjects, 'keyName')
    

    【讨论】:

      【解决方案8】:

      根据许多作者提出的答案,我创建了一个 JsPref 测试场景。 https://jsperf.com/array2object82364

      以下是性能截图。让我有点震惊的是,chrome 的结果与 firefox 和 edge 形成鲜明对比,即使在运行了几次之后也是如此。

      【讨论】:

        【解决方案9】:

        您可以将对象数组合并为一行中的一个对象:

        const obj = Object.assign({}, ...array);
        

        【讨论】:

          【解决方案10】:

          更新:世界一直在转动。请改用函数式方法。

          给你:

          var arr = [{ key: "11", value: "1100" }, { key: "22", value: "2200" }];
          var result = {};
          for (var i=0, len=arr.length; i < len; i++) {
              result[arr[i].key] = arr[i].value;
          }
          console.log(result); // {11: "1000", 22: "2200"}
          

          【讨论】:

          • 因为你就是这样解决这个问题的。关于命名,例如:array 是保留关键字,因此人们使用 arr 代替。等等
          【解决方案11】:

          使用Underscore.js

          var myArray = [
            Object { key="11", value="1100", $$hashKey="00X"},
            Object { key="22", value="2200", $$hashKey="018"}
          ];
          var myObj = _.object(_.pluck(myArray, 'key'), _.pluck(myArray, 'value'));
          

          【讨论】:

            【解决方案12】:

            在 2022 年附近,我特别喜欢这种方法,因为对象数组是动态的,这也是基于 @AdarshMadrecha 的测试用例场景提出的,

            const array = [ 
              { key : '11', value : '1100', $$hashKey : '00X' },
              { key : '22', value : '2200', $$hashKey : '018' }];
              
            let obj = {};
            array.forEach( v => { obj[v.key] = v.value }) //assign to new object
            console.log(obj) //{11: '1100', 22: '2200'}
            

            【讨论】:

              【解决方案13】:

              下面是如何动态地接受上面的字符串并将其插入到一个对象中:

              var stringObject = '[Object { key="11", value="1100", $$hashKey="00X"}, Object { key="22", value="2200", $$hashKey="018"}]';
              
              function interpolateStringObject(stringObject) {
                var jsObj = {};
                var processedObj = stringObject.split("[Object { ");
                processedObj = processedObj[1].split("},");
                $.each(processedObj, function (i, v) {
                    jsObj[v.split("key=")[1].split(",")[0]] = v.split("value=")[1].split(",")[0].replace(/\"/g,'');
                });
              
                return jsObj
              }
              
              var t = interpolateStringObject(stringObject); //t is the object you want
              

              http://jsfiddle.net/3QKmX/1/

              【讨论】:

                【解决方案14】:

                // original
                var arr = [{
                    key: '11',
                    value: '1100',
                    $$hashKey: '00X'
                  },
                  {
                    key: '22',
                    value: '2200',
                    $$hashKey: '018'
                  }
                ];
                
                // My solution
                var obj = {};
                for (let i = 0; i < arr.length; i++) {
                  obj[arr[i].key] = arr[i].value;
                }
                console.log(obj)

                【讨论】:

                • 虽然这可能会回答问题,但最好添加一些关于此答案如何有助于解决问题的描述。请阅读How do I write a good answer了解更多信息。
                【解决方案15】:

                您可以为此使用 mapKeys lodash 函数。只需一行代码!

                请参考此完整代码示例(将其复制粘贴到 repl.it 或类似文件中):

                import _ from 'lodash';
                // or commonjs:
                // const _ = require('lodash');
                
                let a = [{ id: 23, title: 'meat' }, { id: 45, title: 'fish' }, { id: 71, title: 'fruit' }]
                let b = _.mapKeys(a, 'id');
                console.log(b);
                // b:
                // { '23': { id: 23, title: 'meat' },
                //   '45': { id: 45, title: 'fish' },
                //   '71': { id: 71, title: 'fruit' } }
                

                【讨论】:

                  猜你喜欢
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  • 2017-01-14
                  • 1970-01-01
                  • 1970-01-01
                  • 2015-12-10
                  • 1970-01-01
                  相关资源
                  最近更新 更多