为 D3.js 转换数据时使用 forEach() 循环的替代方案答案

【问题标题】：Alternatives for using forEeach() loop while converting data for D3.js为 D3.js 转换数据时使用 forEach() 循环的替代方案
【发布时间】：2016-11-16 16:35:52
【问题描述】：

如earlier post on StackOverflow.com 所示，我仍在努力解决此错误。我已经隔离了问题的原因，即在我的 D3.js 代码中它无法遍历“对象”。我的原始数据源是一个 RESTful web api。使用 jQuery 和 JavaScript 函数，我可以将值加载到名为“数据集”的变量中。当我将“数据集”的内容作为警报输出或使用 jQuery 将其写入 html 元素时，所有数据都在那里。太多的 D3.js 示例使用硬编码的数据文件。因此，重要的是要注意，当我使用相同数据的硬编码版本时，一切正常，但我仅限于使用这种动态的数据虚拟变量。

当我运行代码时，它在这个函数处崩溃：

dataset.forEach（函数（d）{ d.theTime = parseDate(d.theTime); d.theValue = +d.theValue; });

错误信息是Uncaught TypeError: Cannot read property 'length' of undefined。

当我在这个函数之前使用console.log(typeof(dataset)) 时，我得到了“对象”。如果有任何 D3.js 导师阅读本文，我有哪些转换这些数据的选项？我探索了好几个都没有成功。

// ============= 追加01 ========================

因为这里请求的是“数据集”，可以在上面的较早帖子链接（Parsing Time Series Data using D3.js）查看：

var 数据集 = [ {'theTime': '2016/07/12 15:58:40', 'theValue': 1123.07275390625}, {'theTime': '2016/07/12 16:21:10', 'theValue': 1055.6793212890625}, {'theTime': '2016/07/12 16:45:40', 'theValue': 962.4850463867188}, {'theTime': '2016/07/12 17:14:40', 'theValue': 831.2259521484375}, {'theTime'：'2016/07/12 17:55:10'，'theValue'：625.3046875} ];

// ============= 追加02 ========================

关于 Gerardo 的问题，“数据集”变量是“已加载”（我认为），因为代码位于“$.get”函数中，该函数组装了“数据集”变量，如下所示：

//~ 填充“数据集”： var 数据集 = []; $.get（网址，函数（数据）{ var itemCount = data.Items.length; var commaCount = itemCount - 1; for(i=0; i

// ============= 追加03 ========================

我搞定了！

我将在下面发布修改后的工作代码。但是对于任何关注这篇文章的人，我想解释一下我发现了什么。

Mark 建议更改 dataset.push() 以删除所有引号。这给了我对象而不是字符串。经过一些故障排除后，它终于按预期显示（完全激动！），感谢 Mark，您的建议成功了。

这是修改后的代码：

//~ 填充“数据集”： var 数据集 = []; $.get（网址，函数（数据）{ var itemCount = data.Items.length; var commaCount = itemCount - 1; for(i=0; i

【问题讨论】：

您的对象中有这些键吗？更好的是，您可以粘贴或截取该对象的屏幕截图吗？
问题是dataset 是一个对象，但你试图像数组一样使用它。就像@gerardo-furtado 提到的那样，我们需要查看该对象的外观以确定迭代它的最佳方式。既然是对象，那么使用forEach 是行不通的。也许Object.keys(dataset).forEach 或dataset.items.forEach 是正确的...
是的，forEach 将迭代一个 array 对象。
我觉得没问题。我正要告诉你尝试使用括号表示法，但它不会有任何区别......现在我正在考虑异步：你确定你已经在 forEach 之前加载了数据集吗？
在for(i=0; i<itemCount; i++){ 之后执行console.log(dataset) 并使用结果更新您的问题。看起来您正在数据集中构建字符串数组，而不是对象数组。您的推送应如下所示：dataset.push({theTime: formattedDateTime(data.Items[i].Timestamp), theValue: data.Items[i].Value});，不确定您为什么要构建字符串。我认为您的数据集看起来确实像 var dataset = [ "{'theTime': '2016/07/12 15:58:40', 'theValue': 1123.07275390625}", ...]

标签： javascript jquery d3.js time-series timeserieschart

【解决方案1】：

根据错误消息Cannot read property 'length' of undefined，该错误不是来自dataset.forEach，而是来自您正在查找.length 的某个地方。

（注意：在 Chrome 开发工具中，您可以在控制台中检查/扩展错误并查看它来自哪个文件和行号）。

如果它来自您共享的任何代码，那么这就是违规行：

var itemCount = data.Items.length;

如果 data.Items 恰好未定义，您会收到此错误。因此，在错误行之前的行中插入console.log(data)，检查输出，查找data.Items，它可能不存在。您的诊断应该为您指明解决问题的方向。

【讨论】：

【解决方案2】：

如果您不确定您将获得“对象数组”还是“具有键/值的对象”，那么我将在库中使用 _.forEach 'lodash' 将遍历数组对象或对象的键/值。

【讨论】：