human
JavaScriptでは、なぜ矢印関数内の「この」キーワードの値が、それがどのように呼ばれるかではなく、作成されたコンテキストによって決定されるのですか？
gpt
JavaScriptでは、矢印関数内のこのキーワードの値は、矢印関数にこの結合が語彙的であるために作成されたコンテキストによって決定されます。

通常の関数とは異なり、矢印関数には独自のキーワードがなく、代わりに周囲のコンテキストからこの値を継承します。これは、矢印関数内のこれの値が、矢印関数が定義されているときに決定されることを意味します。

これは、JavaScriptで矢印関数がどのように使用されるか、特に関数の呼び出に応じてこの値が変化する状況では、多くの意味があります。矢印関数を使用することにより、関数が呼び出される方法に関係なく、この値が常に同じままであることを確認できます。

たとえば、次のコードを検討してください。

const obj = {
  名前：「ジョン」、
  挨拶：function（）{
    setimeout（function（）{
      console.log（ `こんにちは、私の名前は$ {this.name}`）;
    }、1000）;
  }
};

obj.greet（）;//「こんにちは、私の名前は未定義です」


このコードでは、SettimeOutコール内の通常の関数には、周囲のオブジェクトOBJではなく、この場合はウィンドウ（または厳密なモードでは未定義）である（または厳密なモードでは未定義）によって決定される独自の値があります。これにより、「こんにちは、私の名前は未定義です」というエラーが発生します。

ただし、代わりに矢印関数を使用する場合、この値は次のように、周囲のオブジェクトOBJから継承されます。

const obj = {
  名前：「ジョン」、
  挨拶：function（）{
    setimeout（（）=> {
      console.log（ `こんにちは、私の名前は$ {this.name}`）;
    }、1000）;
  }
};

obj.greet（）;//「こんにちは、私の名前はジョンです」


このコードでは、SettimeOutコール内の矢印関数は、周囲のオブジェクトOBJからこの値を継承します。
human
代わりにTypeScriptコードを使用している場合、動作は変わりますか？「This」オブジェクトはどのタイプですか？さらに、私たちが非同期関数にあるとき、「このオブジェクトはどのように動作しますか？
gpt
TypeScriptの「この」キーワードの動作は、JavaScriptと同じです。「この」オブジェクトは、矢印関数がどのように呼ばれるかではなく、矢印関数が作成されたコンテキストによって決定されます。

TypeScriptでは、「この」オブジェクトのタイプは、矢印関数が作成されたコンテキストに依存します。たとえば、矢印関数がクラス内で定義されている場合、「この」オブジェクトにはクラスインスタンスのタイプがあります。

非同期関数については、非同期関数内の「この」オブジェクトは、関数が作成されたコンテキストによって依然として決定されます。非同期関数が矢印関数である場合、周囲のコンテキストから「この」値を継承します。

たとえば、次のコードを検討してください。

クラスの例{
名前：文字列;

コンストラクター（名前：文字列）{
this.name = name;
}

async greet（）{
新しい約束を待っています（Resolve => {
setimeout（（）=> {
console.log（こんにちは、私の名前は$ {this.name}です）;
解決（）;
}、1000）;
}）;
}
}

const example = new Example（ 'John'）;
example.greet（）;//「こんにちは、私の名前はジョンです」

このコードでは、SettimeOutコール内の矢印関数は、周囲のコンテキストから「この」値を継承します。これは、サンプルクラスのインスタンスです。挨拶方法の非同期性は、矢印関数内の「この」値に影響しません。