javascript - d3jsティック関数定義

Question

私は理解できないように見える問題に遭遇しました。

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

それは正常に動作し、このモードで

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

動作しません。問題はどこだ？

最初のhttp://jsbin.com/omokap/10/editの作業例

2番目のhttp://jsbin.com/isobul/1/editの実例

Answer 1

問題は、tickあるケースではその定義の前に、別のケースではその定義の後に使用していることです。

最初のケースでは:

force.on("tick", tick);

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

関数tickは解析時に定義され、2 番目の引数として渡すことができます。

一方、次の場合：

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

theとbetterの使用の違いを理解するには、この質問を参照してください。var tick = function () ...function tick() ...