このキーワードはJavaScriptで

このキーワードを理解するには、次の画像の助けを借りて英語で“this”という単語の例を挙げましょう.


上記の2つのイメージから、私が説明しようとしているものは、このキーワードが属するオブジェクトを参照することです.その値は使用する場所に依存します.
このキーワードは、関数の所有者の値を取得し、関数の所有者を指します.このキーワードの値は静的ではなく、関数の呼び出し方によって決まります.
ブラウザーで単純なconsole.log(this)をするなら、出力はこのオブジェクトが機能と呼ばれているオブジェクトを示すということを示すグローバルオブジェクト(ウインドウオブジェクト)です.
関数は4つの方法で一般的に呼び出すことができます(他の方法があります).
方法として次のコード例では、このキーワードは詳細オブジェクトを指します.これは、関数と呼ばれる詳細オブジェクトであり、したがって所有者オブジェクトです.

'use strict'
const detail = {
  name: "samurai",
  year: "2020",
  calcAge: function () {
    return 2077 - this.year;
  },
};
detail.calcAge();//57

厳密なモードでの単純な関数呼び出しとして

.

'use strict'
function sum() {
  let add = 2 + 2;
  console.log("sum of two numbers is" + add);
  console.log(this);
}
sum();

通常の関数では、このキーワードはウィンドウオブジェクトを指しますが、strict modeを使用すると未定義です.

矢印機能:彼らは自分のこのキーワードを取得しません.代わりに、周囲の関数または親関数は、辞書のスコープによって、このキーワードが指すものです.

イベントリスナーとして

:この場合、このキーワードは
イベントに接続されたハンドラ関数.

このキーワードが関数を使っている関数を指していないことを覚えておかなければなりません.
概要
1 .これは関数と呼ばれる所有者オブジェクトまたはオブジェクトを参照します.
2 .このキーワードの値は使用する場所によって異なります.'use strict'がコードにあるならば、これは単純な関数呼び出しのために窓オブジェクトに未定義の他の点を指します.