Question

在学习JavaScript和d3.js方面非常新

以下语法从名为“数据”的关联数组中保存的每个对象创建一个新的属性名称数组。

排除“数据”中第一个对象的属性名称。

d3.keys(data[0])
  .filter(function(key) { return key !== "date";}))

我不明白为什么下面的代码没有给我相同的结果？

d3.keys(data)
  .filter(function(key) { return key !== "date";}))

为什么告诉d3选择[0]索引位置以及对对象属性名称进行过滤。 d3.keys（ object ）方法是否不贯穿关联数组并返回一个新数组，该数组包含定义中每个指定对象的属性名称？这让我觉得您只需要过滤？

Answer 1

解释很简单：您不能将数组传递给d3.keys，它必须是一个对象。 API对此很清楚：

返回一个包含指定对象的属性名称的数组。（强调我的）

如果您查看source code，您会发现d3.keys使用for...in循环：

export default function(map) {
    var keys = [];
    for (var key in map) keys.push(key);
    return keys;
};

这不适用于数组。让我们看看：

function d3keys(map) {
  var keys = [];
  for (var key in map) keys.push(key);
  return keys;
}

var myArray = [{
  x: "foo",
  y: "bar"
}, {
  x: "foobar",
  y: "barbaz"
}];

console.log(d3keys(myArray))

如果使用不带D3的Object.keys()，也会发生同样的事情：

var myArray = [{
  x: "foo",
  y: "bar"
}, {
  x: "foobar",
  y: "barbaz"
}];

console.log(Object.keys(myArray))

其解释是，您不能（或不应）将for...in与数组一起使用。根据{{3}}：

注意：for ... in不应用于遍历索引顺序很重要的Array。

最重要的部分：

数组索引只是具有整数名称的可枚举属性。（强调我的）

因此，我们必须传递一个 object 。在这种情况下，例如myArray[0]：

function d3keys(map) {
  var keys = [];
  for (var key in map) keys.push(key);
  return keys;
}

var myArray = [{
  x: "foo",
  y: "bar"
}, {
  x: "foobar",
  y: "barbaz"
}];

console.log(d3keys(myArray[0]))

d3.keys（）语法说明了吗？

1 个答案: