Question

我有一个数组，比如说

var arr = ["id", "currency", "region", "status"]

如何将上面的内容映射到对象文字，如下所示？

var columns = [
      { key:"id",        headerRenderer:"id" },
      { key:"currency",  headerRenderer:"currency" },
      { key:"status",    headerRenderer:"region" },
      { key:"region",    headerRenderer:"status" }
    ];

提前致谢！

Answer 1

一种解决方案是使用Array#map方法。

map（）方法创建一个新数组，其结果是在此数组中的每个元素上调用一个提供的函数。提供的函数是callback。

所以，正如我上面所说的那样map方法按顺序为数组中的每个元素提供一次回调函数，并从结果中构造一个新数组。 result数组中的元素为objects，如下所示：{"key":item, "headerRenderer":item}。

var array = ["id", "currency", "region", "status"]
var columns=array.map(function(item){
    return {
      "key":item,
      "headerRenderer":item
    }
});
console.log(columns);

Answer 2

map method on the Array prototype允许您将函数应用于数组中的每个元素，从而有效地抽象迭代以获得简单的情况。您的案例很简单，因为result中任何条目的内容都由arr中的相应条目完全指定，这意味着您可以＆＃34;映射＆＃34;

"id" --> { key: "id", headerRenderer: "id" }

使用地图，您只需一行即可解决问题（假设您的环境支持ES6）：

＆＃13;

var arr = ["id", "currency", "region", "status"]

var result = arr.map(key => ({ key, headerRenderer: key }));

console.log(result);

＆＃13;

Answer 3

var columns = [];
var array = ["id", "currency", "region", "status"];

for (var i = 0, len = array.length; i < len; i++) {
  columns.push({
    key: array[i],
    headerRenderer: array[i]
  });
}

Answer 4

通常.map()是方法，但另一种功能方法是使用尾调用递归映射，如下所示;

＆＃13;

var arr = ["id", "currency", "region", "status"],
   mapo = (a, r=[]) => a.length ? mapo(a.slice(1),r.concat({key:a[0],headerRenderer:a[0]})) : r;
console.log(mapo(arr));

＆＃13;

Javascript数组在循环中动态构建

4 个答案: