javascript - d3js tick function definition -

i encountered problem can not seem understand, why if define tick function this;

function tick () { /* */ }

it works fine , in mode

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

doesn't work. problem?

the problem using tick before definition in 1 case , after definition in other case.

in first case:

force.on("tick", tick);  function tick () { /* ... */ }

the function tick defined @ parse time , available passed second argument.

on other hand in:

force.on("tick", tick);  var tick = function () { /* ... */ };

the variable tick defined @ parse time (so jshint not complain), gets value @ runtime. value undefined when force.on("tick", tick) executed.

the difference more apparent when consider following example:

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

versus:

if (true) {      function f () { return 1; } } else {      function f () { return 2; } }  f(); // returns 2, latest definition

see this question understand difference between using var tick = function () ... , function tick() ... better.

Live