Самостоятельно вызова анонимные функции

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? Как работает эта «магия»?

Answer 1

В первом фрагменте d является элементом массива data. Анонимная функция, заданная как второй аргумент .forEach(), выполняется для каждого элемента массива data и анализирует атрибут .date данных.

Во втором случае анонимная функция во втором аргументе d3.extent() сообщает D3, как извлечь значение, которое будет использоваться для вычисления степени от data. То есть каждый элемент из data считается вычисляющим степень значений в массиве, но элементы также могут быть сложными объектами вместо простых чисел. Для чисел не требуется второй аргумент (функция доступа), но для объектов (как в этом случае) вам нужно сообщить D3, какое значение следует учитывать - .date.

В обоих случаях анонимные функции применяются к каждому элементу массива data, а аргумент d, который передается им, является соответствующим элементом массива. Обратите внимание, что имя d здесь произвольно, вы могли бы также позвонить по телефону delement или 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.