ホームページ ウェブフロントエンド jsチュートリアル なぜ `bind()` はアロー関数の `this` で動作しないのでしょうか?

なぜ `bind()` はアロー関数の `this` で動作しないのでしょうか?

Dec 13, 2024 pm 05:07 PM

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

アロー関数の「this」バインディングの難問: 明らかにされる難題

アロー関数の魅力的なシンプルさにもかかわらず、' に関する不可解な動作これは多くの開発者を困惑させてきました。アロー関数内の特定のコンテキストに「this」をバインドできないことが、繰り返し発生するフラストレーションの原因となっています。

ジレンマを説明するには、次のコードを考えてみましょう。

const f = () => console.log(this);

const o = { a: 42 };

const fBound = f.bind(o);

fBound(); // Expected: { a: 42 }, Actual: { window: Window }
ログイン後にコピー

この例ではでは、「bind()」メソッドを使用して、アロー関数「f」の「this」コンテキストをオブジェクト「o」にバインドしようとします。ただし、'fBound()' を呼び出すと、不可解なことに、予期された 'o' オブジェクトではなく、グローバル 'window' オブジェクトがログに記録されます。

この複雑な動作は、アロー関数の固有の性質に根ざしています。独自の「this」コンテキストを持つ通常の関数とは異なり、アロー関数は周囲の字句スコープから「this」バインディングを継承します。この場合、'f' はグローバル スコープ内で定義され、グローバル 'window' オブジェクトにバインドされた 'this' をレンダリングします。

ECMAScript 2015 仕様には次のように明記されています。

ArrowFunction 内の引数、super、this、または new.target は、字句的に囲むバインディングに解決される必要があります。環境."

したがって、アロー関数内で 'this' を再バインドすることは不可能になります。 「this」は、アロー関数が定義されたコンテキストに永久に固定されたままになります。

コードにとって「this」を意味のある使用することが重要である場合、賢明な行動は、関数の代わりに通常の関数を使用することです。矢印機能。通常の関数を使用すると、「this」バインディングをより詳細に制御できるため、「bind()」または他のメソッドを使用して「this」を目的のコンテキストに明示的にバインドできます。

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

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

ホットな記事タグ

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

JavaScriptの文字列文字を交換します JavaScriptの文字列文字を交換します Mar 11, 2025 am 12:07 AM

JavaScriptの文字列文字を交換します

カスタムGoogle検索APIセットアップチュートリアル カスタムGoogle検索APIセットアップチュートリアル Mar 04, 2025 am 01:06 AM

カスタムGoogle検索APIセットアップチュートリアル

例JSONファイルの例 例JSONファイルの例 Mar 03, 2025 am 12:35 AM

例JSONファイルの例

8見事なjQueryページレイアウトプラグイン 8見事なjQueryページレイアウトプラグイン Mar 06, 2025 am 12:48 AM

8見事なjQueryページレイアウトプラグイン

10 jQuery構文蛍光物 10 jQuery構文蛍光物 Mar 02, 2025 am 12:32 AM

10 jQuery構文蛍光物

独自のAjax Webアプリケーションを構築します 独自のAjax Webアプリケーションを構築します Mar 09, 2025 am 12:11 AM

独自のAjax Webアプリケーションを構築します

' this' JavaScriptで? ' this' JavaScriptで? Mar 04, 2025 am 01:15 AM

' this' JavaScriptで?

10 JavaScript&JQuery MVCチュートリアル 10 JavaScript&JQuery MVCチュートリアル Mar 02, 2025 am 01:16 AM

10 JavaScript&JQuery MVCチュートリアル

See all articles