определение функции галочки d3js

Question

Я столкнулся с проблемой, которую я не могу понять, почему, если определить функцию тика, как это;

function tick() { /* do something */ } 

Он отлично работает и в этом режиме

var tick = function() { /* do something */ } 

не работает. В чем проблема?

рабочий пример первого http://jsbin.com/omokap/10/edit

рабочий пример второго http://jsbin.com/isobul/1/edit

Answer 1

Проблема в том, что вы используете tick до его определения в одном случае, и после его определения в другом случае.

В первом случае:

force.on("tick", tick); 

function tick() { /* ... */ } 

функция tick определяется во время синтаксического анализа и доступен будет принят в качестве второго аргумента.

С другой стороны в:

force.on("tick", tick); 

var tick = function() { /* ... */ }; 

переменной tick определяется во время синтаксического анализа (так JSHint не жалуюсь), но он получает значение только во время выполнения. Его значение равно undefined, когда исполняется force.on("tick", tick).

Разница более очевидным, если рассмотреть следующий пример:

var f; 
if (true) { 
    f = function() { return 1; }; 
} else { 
    f = function() { return 2; }; 
} 

f(); // returns 1 

против:

if (true) { 
    function f() { return 1; } 
} else { 
    function f() { return 2; } 
} 

f(); // returns 2, from the latest definition 

См this question, чтобы понять разницу между использованием var tick = function() ... и function tick() ... лучше.