Bind() メソッドが JavaScript に不可欠なのはなぜですか?

JavaScriptのbind()はなぜ必要ですか?

問題と解決策

JavaScriptでは、 this キーワードは、関数が呼び出されるオブジェクトを参照します。ただし、関数が変数に割り当てられてから間接的に呼び出される場合、この値は予測不能になる可能性があります。これにより、「これは未定義です」または「これはグローバル オブジェクトです」などのエラーが発生する可能性があります。

この問題に対処するために、JavaScript は binding() メソッドを提供します。 bind(object) を呼び出すことで、後で呼び出す場合でも、関数の this 値を明示的に設定できます。これにより、this 値が予期せず変更されることがなくなります。

問題が発生する理由

前に説明したように、this 値は呼び出しコンテキストによって決定されます。関数が直接呼び出された場合、 this 値は単にその関数が呼び出されたオブジェクトになります。ただし、関数が変数に割り当てられると、元の呼び出しコンテキストが失われます。

例 1

<code class="js">this.name = "John";

var myName = {
  name: "Tom",
  getName: function() {
    return this.name
  }
}

var storeMyName = myName.getName;</code>

例 1 では、storeMyName はへの参照です。 getName 関数。 storeMyName が呼び出されると、myName オブジェクト内の元のコンテキストが失われます。したがって、storeMyName 内のこれは、myName オブジェクトではなく、グローバル オブジェクトを参照します。

解決策 (bind)

<code class="js">var storeMyName2 = myName.getName.bind(myName);</code>

例 2 では、bind() が使用されます。 getName の this 値を myName オブジェクトに明示的に設定します。これにより、storeMyName2 が呼び出されたときに、グローバル オブジェクトではなく、myName オブジェクトが参照されるようになります。

例 3 で問題が解決される理由

<code class="js">var storeMyName3 = myName.getName();</code>

例 3変数に関数を代入しない点が他のものとは異なります。代わりに、myName.getName() を直接呼び出し、結果を storeMyName3 に保存します。これは、storeMyName3 が関数ではなく、getName 関数によって返される値であることを意味します。したがって、 this の値を気にする必要はありません。

以上がBind() メソッドが JavaScript に不可欠なのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。