javascript - Javascript定義関数

Question

私はカーンアカデミーでJavascriptを学んでいます。私が見ているのは：http ：//www.khanacademy.org/cs/speed-circles/964929070

「vardraw=function（）{...}」という行があります。彼はdrawという関数を定義していますか？または、変数drawが関数を呼び出していますか（定義されていません）？

ありがとう！

Answer 1

はい、関数式が。という名前の変数に割り当てられていますdraw。あなたもそれを呼び出すことができます：

var draw = function() {
    console.log('xyz');
};

draw(); // 'xyz'

Answer 2

JavaScriptでは、関数は配列や論理的にオブジェクトと同じようにオブジェクトです。すでにお気づきかもしれませんが、これらのオブジェクトは多数の変数に割り当てることができますが、これらの変数の1つを変更するとすぐに、すべてが変更されます。これは、JSが常に値で割り当てるが、変数にオブジェクトが直接割り当てられることはないためです。オブジェクトへの参照が割り当てられます。

var obj = {iam: 'an object'};
var reassign = obj;
console.log(obj);//shows object
console.log(reassign);//surprize, shows the same thing
reassign.bar = 'foobar';
console.log(obj.bar);//logs foobar, the variable obj has gained the same property, because it is the same object.

同じことがオブジェクトである関数にも当てはまり、あらゆる場所の変数/プロパティに割り当てることができますが、それでも同じオブジェクト/関数のままです。

var foo = function()
{
    console.log('I am an object');
};
var second = foo;
second();//logs I am an object
console.log(second === foo);//logs true, because they both reference the same thing

では、なぜ、期待どおりに関数を宣言するのではなく、無名関数が変数に割り当てられているのかと疑問に思うかもしれません。上手：

function foo(){}

コードを実行する前に、JSはすべての関数宣言と変数宣言をスコープの一番上に移動しますが、あなたの場合、単に関数を定義したり、変数を宣言したりするのではありません。JSは何かをしなければなりません。あまりにも：変数への参照を割り当てます。関数は引き上げられません：

var foo = function()
{
    console.log('foo');
};
foo();//logs foo
foo = function()
{
    console.log('bar');
};
foo();//logs bar now

割り当ての前にfooが定義されていなかった場合、エラーが発生します。上記のコードの前にコードがある場合、JSはfooの変数宣言を引き上げますが、その値は未定義のままです。

ポイントは何ですか？これは、クロージャーを使い始めるとき、またはブランチ（if (x){ foo = functionX} else { foo = functionY;}）に応じて関数を変える必要がある場合に役立ちます。これらは、スコープの巻き上げを避けたい2つの理由です...しかし、すべてのATMの最も重要な理由は、その場で関数を再定義する必要があります

Answer 3

function draw(){ return "サンプル"; };

var draw = function(){ return "サンプル"; };

は同じ意味です。

Answer 4

processing.js では (このカーン アカデミーのデモで使用されているように)、関数 draw はすべてのフレーム参照 docで自動的に呼び出されることに注意してください。

このコードは、指定されたコードがすべてのフレームで呼び出されるように、draw の既定の (空の) 実装をオーバーライドします。

Khan academy には、この draw 関数の使用に関するチュートリアルがあります。

Answer 5

function () { ... }関数値を作成します。つまり、数値やjavascriptの他のオブジェクトと同じくらい簡単に渡すことができるものです。

次に、後で参照できるように、それを名前の描画にバインドします。

彼は書くこともできたでしょう

function draw() {
    ...
}

これらの目的では、それらは同等です。