Question

我将用一个简单的例子说明我想要做什么。假设我有一个变量rows，内容为：

[ { id: 1,
    admin_id: 2,
    start_date: Mon Nov 18 2013 07:19:46 GMT-0800 (PST),
    status: 1,
    username: 'Marko Markovic' },
  { id: 7,
    admin_id: 3,
    start_date: Mon Nov 18 2013 07:20:32 GMT-0800 (PST),
    status: 0,
    username: 'Dzoni Noksvil' } ]

现在，我要创建的内容如下：

var gl = { 
        1: { admin: "Marko Markovic" , status: "1" },
        7: { admin: "Dzoni Noksvil" , status: "0" }
    };

所以，我需要循环遍历rows，并且对于每一行，根据我认为从上面的示例中清楚的规则向gl对象添加一行。

所以我试过了。

var gl;

rows.forEach(function(row) {
    gl[row.id] = { admin: row.username, status: row.status };
});

以上代码引发错误Cannot set property '1' of undefined。我也试过以下内容，知道它不起作用，但对于它将抛出的错误感到好奇：

var gl;

rows.forEach(function(row) {
    gl.row.id = { admin: row.username, status: row.status };
});

错误是Cannot read property 'row' of undefined。

有人可以告诉我如何正确地执行此操作，并且如果可能的话，可以告诉我错误的含义，因为我不知道这里应该是什么undefined。

哦，而且请，只是简单的Javascript，即使jQuery有一个更简单/更好的解决方案。

Answer 1

var gl;

默认情况下会使用gl初始化undefined。如果您正在尝试构建对象，则必须使用对象初始化它，如此

var gl = {};

或者您可以使用Array.prototype.reduce函数执行此操作，例如

var data = [ { id: 1,
    admin_id: 2,
    start_date: "Mon Nov 18 2013 07:19:46 GMT-0800 (PST)",
    status: 1,
    username: 'Marko Markovic' },
  { id: 7,
    admin_id: 3,
    start_date: "Mon Nov 18 2013 07:20:32 GMT-0800 (PST)",
    status: 0,
    username: 'Dzoni Noksvil' } ];

var result = data.reduce(function(result, currentObject) {
    result[currentObject.id] = {
        admin: currentObject.username,
        status: currentObject.status
    };
    return result;
}, {});

console.log(result);

<强>输出

{ '1': { admin: 'Marko Markovic', status: 1 },
  '7': { admin: 'Dzoni Noksvil', status: 0 } }

Online Demo - 它有你的固定版本和我建议的版本。

Answer 2

你忘了初始化“gl”

var gl = {};

此外，您可以改为使用.reduce：

var gl = rows.reduce(function(gl, row) {
  gl[row.id] = { admin: row.username, status: row.status };
  return gl;
}, {});

我不知道你的“id”值是什么样的，但是如果你总是使用数字键，那么在我看来你不妨让“gl”成为一个数组，而不仅仅是一个普通的宾语。这样，您就可以使用.forEach等。

请注意，本机迭代器函数会跳过它们运行的数组中的“漏洞”。这意味着在这种情况下，如果你以“gl”作为数组开始，你最终会得到位置0,2,3,4,5和6的孔，因为你只设置了1和7。数组的数量为8，但调用.forEach()或.map()或任何只会执行两次调用回调。这与jQuery的$.each()等不同。

Answer 3

您忘记初始化gl，以便当您尝试在其上设置属性时，其值为undefined。

var gl = {};
…

Answer 4

如果您需要支持不支持原生Array.prototype.reduce的旧浏览器，那么您可以使用常规for循环和新数组：

var gl = function () {
  var myArray = [];
  for (var i = 0; i < rows.length; i++) {
      var self = rows[i];
      var obj = {};
      obj[self.id] = {
          admin: self.username,
          status: self.status
      }
      myArray.push(obj);
  }
  return myArray;
};

// output
console.log(gl());

jsFiddle

更改Javascript对象/数组的格式

4 个答案: