将新数字“推送”到对象数组中答案

【问题标题】：'push' new number into an array of objects将新数字“推送”到对象数组中
【发布时间】：2018-02-22 09:54:03
【问题描述】：

我有一长串存储在 CSV 文件中的日期。我已经成功地使用 d3.js 加载了这个数据集。现在我想向这个数据集添加另一列，其中包含我列表中每个日期的随机数。

我相信此数据集已作为对象数组加载。所以我使用下面的代码来尝试遍历数组。不过，我认为push 方法是错误的方法，因为它涉及对象。

d3.csv('claims_cwy.csv', rowConverter, function(dataset) {
    console.log(dataset);

    for(var i=0; i<10; i++) {           
        var newNumber = Math.round(Math.random() * 10);
        dataset[i].push(newNumber);
    }

【问题讨论】：

标签： javascript arrays d3.js

【解决方案1】：

尽管这个问题有几个答案，但没有一个涉及惯用的 D3：

由于您已经有了row conversion function，请使用该函数更改数据数组中的对象。只需将其添加到行函数（使用d 作为第一个参数）：

d.random = Math.random() * 10;
//  ^----- or any other property name

这是一个演示：

var csv = `foo,bar,baz
12,34,21
14,42,27
17,35,17`;

var data = d3.csvParse(csv, rowConverter);

function rowConverter(d) {
  d.random = Math.random() * 10;
  return d;
}

console.log(data)

&lt;script src="https://d3js.org/d3.v4.min.js"&gt;&lt;/script&gt;

【讨论】：

终于！您可能还希望保持columns 字段与对象同步，即const FIELD = "random"; function rowConverter(d, i, columns) { if (i===0) columns.push(FIELD); d[FIELD] = Math.random() * 10; }。或者，如果这看起来不妥，您可以改为在主回调中进行。
好提示。由于大多数用户甚至不知道存在 columns 属性，因此我没有考虑为其添加新值。

【解决方案2】：

你可以试试这个：

d3.csv('claims_cwy.csv', rowConverter, function(dataset) {
    console.log(dataset);

    for(var i=0; i<dataset.length; i++) {           
        var newNumber = Math.round(Math.random() * 10);
        dataset[i].nameOfProperty = newNumber;
    }
}

你从数组中获取每个对象，并给它一个带有随机数的新属性。

【讨论】：

【解决方案3】：

如果您想为数组中的每个对象添加一个随机数，方法如下：

for(var i = 0; i < 10; i++) {           
    var newNumber = Math.round(Math.random() * 10);
    dataset[i]['random_number'] = newNumber;
}

这将为每个对象创建一个名为 random_number 的新属性

【讨论】：

【解决方案4】：

您可以使用数组 map() 方法巧妙而巧妙地做到这一点。来自MDN：

map 为每个元素调用一次提供的回调函数数组，按顺序，并根据结果构造一个新数组。

因此，对于数据集数组中的每个元素，您将返回原始属性并添加新的 random_number 属性。

见working fiddle

var dataset = [
    {"date": "02/10/2017", "climb": "696"},
    {"date": "04/10/2017", "climb": "1004"},
    {"date": "06/10/2017", "climb": "1516"},
    {"date": "13/10/2017", "climb": "932"},
    {"date": "15/10/2017", "climb": "2005"}
];

dataset = dataset.map(function(d) {
  return {
      "date": d.date,
      "climb": d.climb,
      "random_number": Math.round(Math.random() * 10)
  }
});

值得一提的是，当您使用 d3 时，您可以使用 d3-random module 中的各种随机数方法之一，而不是 Math.random()。

【讨论】：