更改Javascript对象/数组的格式

时间:2014-01-18 15:13:05

标签: javascript

我将用一个简单的例子说明我想要做什么。假设我有一个变量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有一个更简单/更好的解决方案。

4 个答案:

答案 0 :(得分:3)

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 - 它有你的固定版本和我建议的版本。

答案 1 :(得分: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()等不同。

答案 2 :(得分:2)

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

var gl = {};
…

答案 3 :(得分:2)

如果您需要支持不支持原生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