ホームページ > ウェブフロントエンド > jsチュートリアル > 字句結合は ES6 アロー関数の「this」キーワードにどのような影響を与えますか?

字句結合は ES6 アロー関数の「this」キーワードにどのような影響を与えますか?

Barbara Streisand
リリース: 2024-12-18 15:27:12
オリジナル
434 人が閲覧しました

How Does Lexical Binding Affect the

ES6 のアロー関数における "this" の字句バインディング

ES6 のアロー関数は、"this." のユニークな字句バインディング動作で有名です。 」 「this」が動的にバインドされる他の JavaScript 関数とは異なり、アロー関数は字句スコープを維持し、「this」をそれを囲むコンテキストと同じ値に割り当てます。

この概念を説明するために、次のコードを考えてみましょう。

var testFunction = () => {
  console.log(this)
};
testFunction();
ログイン後にコピー

「this」がグローバル オブジェクト (ウィンドウ) を参照する従来の JavaScript の動作とは異なり、アロー関数は、それを囲んでいるコンテキストの「this」値をキャプチャします。この例では、testFunction がオブジェクトの外部で定義されているため、「this」はグローバル スコープ (ウィンドウ) を指します。

さらに、字句バインディングにより、アロー関数の存続期間全体にわたって「this」の一貫性が確保されます。次の例を考えてみましょう。

function Person(){
  this.age = 0;

  setInterval(() => {
    this.age++; // |this| properly refers to the person object
  }, 1000);
}

var p = new Person();
ログイン後にコピー

ここで、アロー関数は Person オブジェクトの「this」値をキャプチャし、そのプロパティにアクセスして変更できるようにします (この場合は、age プロパティをインクリメントします)。この動作により、アロー関数の呼び出し方法や実行コンテキストの変更に関係なく、「this」が常に正しいコンテキストを参照することが保証されます。

以上が字句結合は ES6 アロー関数の「this」キーワードにどのような影響を与えますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート