Question

我想了解d3.js的以下示例： http://bl.ocks.org/mbostock/3884955

在示例中，有许多代码行如下所示：

data.forEach(function(d) {
    d.date = parseDate(d.date);
});

或

x.domain(d3.extent(data, function(d) { return d.date; }));

但我无法弄清楚，哪里的d作为参数传递，d是什么？这是怎样的魔法＆＃34;工作？

Answer 1

在第一个代码段中，d是数组data的元素。作为.forEach()的第二个参数给出的匿名函数是为数组data的每个元素执行的，并解析该数据的.date属性。

在第二种情况下，d3.extent()的第二个参数中的匿名函数告诉D3如何从data中提取用于计算范围的值。也就是说，data的每个元素被认为是计算数组中值的范围，但元素也可以是复杂对象而不是简单数字。对于数字，不需要第二个参数（访问函数），但对于对象（如本例所示），您需要告诉D3要考虑的值是什么 - .date。

因此，在这两种情况下，匿名函数都应用于数组data中的每个元素，并且传递给它们的参数d是数组的相应元素。请注意，此处的名称d是任意的，您也可以调用d element或datum或类似的内容。

Answer 2

您的回调不是自我调用 - 您直接调用的函数（forEach或extent）会调用它。

该函数决定何时调用您的回调，以及使用什么参数。在Array.prototype.forEach的情况下，对于数组的每个元素执行一次。参数是当前元素和数组索引。

例如，简单的forEach - 样式函数可能如下所示：

function each(array, callback) {
  for(var i = 0; i < array.length; ++ i) {
    callback(array[i], i);
  }
}

使用示例：

each([1,2,3], function(element, i) {
  console.log(element * element, i);
})

// Output: 
// 1 0
// 4 1
// 9 2

注意你的回调是如何执行三次的，每次都有不同的参数。你的回调不控制参数或被调用的次数 - 这是在each的控制之下。

自我调用匿名函数

2 个答案: