ホームページ >ウェブフロントエンド >jsチュートリアル >Javascript の `call()` と `apply()` と `bind()`: いつどちらを使用するべきですか?

Javascript の `call()` と `apply()` と `bind()`: いつどちらを使用するべきですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-12-02 00:07:16227ブラウズ

Javascript `call()` & `apply()` vs. `bind()`: When Should You Use Which?

Javascript: call() & apply() と binding() の再訪

call() と apply() を使用すると変更が可能になります関数のコンテキストを取得し、引数を手動または配列として渡すと、bind() メソッドは独自のメソッドを提供します。 approach.

bind() を使用する場合

Bind は、後で実行するために事前定義されたコンテキストを使用して関数を作成する必要がある場合に特に便利です。関数をすぐに呼び出す call() や apply() とは異なり、bind は指定されたコンテキスト セットを持つ新しい関数を返します。

次の例は違いを示しています。

var obj = {
  x: 81,
  getX: function() {
    return this.x;
  }
};

alert(obj.getX.bind(obj)()); // 81
alert(obj.getX.call(obj)); // 81
alert(obj.getX.apply(obj)); // 81

この例ではたとえば、bind() は、実行時にそのコンテキストが常に obj オブジェクトに設定される新しい関数を作成します。これは、関数コンテキストがあいまいになる可能性があるイベント リスナーで特に役立ちます。

使用例

  • イベント リスナー:非同期で正しいオブジェクト参照を維持するためのイベント ハンドラーのコンテキストcallbacks.
  • 非同期コールバック: 非同期 Node.js コールバックで元の関数のコンテキストを保持します。
  • Currying: で新しい関数を作成します。関数のオリジナルを保持しながら、引数の固定セットcontext.

例:

function MyObject(element) {
  this.elm = element;

  element.addEventListener('click', this.onClick.bind(this), false);
}

MyObject.prototype.onClick = function(e) {
  var t = this; // do something with [t]...
  // Without bind, the context of this function would be different.
};

結論

バインドを使用すると、事前定義されたコンテキストを使用して関数を作成できますこれにより、イベント処理、非同期プログラミング、およびコンテキストの維持が重要なその他のシナリオで特に役立ちます。 call() と apply() は即時の関数呼び出しを提供しますが、bind は固定コンテキストで後で実行するための関数を返します。

以上がJavascript の `call()` と `apply()` と `bind()`: いつどちらを使用するべきですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。