ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript のアロー関数で「bind()」が機能しないのはなぜですか?

JavaScript のアロー関数で「bind()」が機能しないのはなぜですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-12-08 22:39:11897ブラウズ

Why Doesn't `bind()` Work with Arrow Functions in JavaScript?

アロー関数のバインディング: 説明

JavaScript でアロー関数を使用する場合、開発者は「this」のバインディングに関して予期しない動作に遭遇する可能性があります。通常の関数とは異なり、アロー関数は字句スコープを維持します。つまり、アロー関数が定義された環境の「this」バインディングを継承します。したがって、アロー関数内で 'this' を再バインドすることはできません。

次の例を考えてみましょう:

var f = () => console.log(this);
var o = {'a': 42};
var fBound = f.bind(o);
fBound();

このコード スニペットでは、アロー関数 'f' をバインドしようとしています。 '.bind()' メソッドを使用してオブジェクト 'o' にコピーします。ただし、'fBound' を呼び出すと、'o' ではなくグローバル 'window' オブジェクトが出力されます。

これは、アロー関数が字句的に囲む環境 (この場合はこれ) から 'this' バインディングを継承するためです。グローバル実行コンテキストです。その結果、「f()」と「fBound()」は常にグローバルの「this」を参照します。

この問題を回避するには、バインドが必要な場合は通常の関数を使用することをお勧めします。これらの関数は新しい実行コンテキストを作成し、「.bind()」メソッドを使用して「this」バインディングを明示的に設定できるようにします。

以上がJavaScript のアロー関数で「bind()」が機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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