Question

我有以下对象

"data":{  
         "name 1":"a",
          "name 2":"b",
          "name 3":"b",
        },

如何转换为保持名称和数据“a”，“b”的对象数组，以便我可以映射和渲染每个传递名称和数据的组件？

Answer 1

如果您使用缩减功能，则可以执行以下操作来实现目标

Object.keys(data).reduce((array, key) => {
    return [...array, {key: data[key]}]
}, [])

Reduce是一个很酷的函数，可以将数据迭代并组合成一个单独的项目（可以是1个对象，数组，整数等）。

Object.keys()是一种从当前对象获取每个键并能够遍历每个键的方法。

Answer 2

Tall Paul提供的解决方案可以很好地工作，但您也可以使用Object.entries()。它说明了

Object.entries（）方法返回给定对象自己的可枚举属性[key，value]对的数组，其顺序与for ... in循环提供的顺序相同（不同之处在于 - in循环枚举原型链中的属性。）

所以你可以尝试这样的事情

let result = Object.entries(data);
result.map((item, index)=>{
      console.log('key is:- ', item[0], ' and value is:- ', item[1]); 
});

Answer 3

js本地方法你可以使用;

var data = {  
     "name 1":"a",
      "name 2":"b",
      "name 3":"b",
    };
    var newObj = [...Object.values(data), ...Object.keys(data)]
    console.log(newObj)

Answer 4

您可以使用Object.keys函数获取数组中对象中的所有键，并使用map函数获取所需的输出。

这将转换为对象数组，它将保留名称和数据。

var data = {  
          "name 1":"a",
          "name 2":"b",
          "name 3":"b",
}
var res = Object.keys(data).map(function(name){
	var obj = {};
	obj[name] = data[name];
	return obj;
});

console.log(res);

React - 将对象转换为具有属性的对象数组

4 个答案: