JavaScript における this ポイントの問題の詳細な説明

要約する

• 地球環境 ➡️ ウィンドウ
• 通常関数 ➡️ ウィンドウまたは未定義
• コンストラクター ➡️ 構築されたインスタンス
• 矢印関数➡️ 定義されている場合は外側のスコープで this
• オブジェクトメソッド ➡️ オブジェクト
• call(), apply(), bind() ➡️ 最初のパラメータ

地球環境

厳密モードに関係なく、これはウィンドウ オブジェクトを参照します。

console.log(this === window) // true

// 厳密モード 'use strict'
console.log(this === window) // true

通常機能

1. 通常モード
   • これはウィンドウオブジェクトを参照します
     

   関数テスト() {
     この===ウィンドウを返す
   }
   
   console.log(test()) // 真
   

2. 厳密モード
   • この値は未定義です
     

   // 厳密モード 'use strict'
   
   関数テスト() {
     これを返す === undefined
   }
   
   console.log(test()) // 真
   

コンストラクタ

関数がコンストラクターとして使用される場合、これは構築されたインスタンスを指します。

関数テスト() {
  この数値 = 1
}

test1 = 新しい Test() とする

console.log(テスト1.番号) // 1

矢印関数

関数が矢印関数の場合、 this は関数が定義されたときの前のスコープ内の this 値を参照します。

テスト = () => {
  この===ウィンドウを返す
}

console.log(test()) // 真

obj = {
  番号: 1
}

関数foo(){
  戻り値 () => {
    this.numberを返す
  }
}

テスト = foo.call(obj) を実行します。

コンソール.log(テスト()) // 1

オブジェクトメソッド

関数がオブジェクトのメソッドとして使用される場合、this はオブジェクトを参照します。

obj = {
  番号: 1,
  取得番号() {
    this.numberを返す
  }
}

コンソール.log(obj.getNumber()) // 1

呼び出し()、適用()、バインド()

• 関数の call() または apply() メソッドを呼び出すと、関数の this は渡された最初のパラメータを指します。
• 関数の bind() メソッドが呼び出されると、返される新しい関数の this は渡された最初のパラメータを指します。

obj = {
  番号: 1
}

関数テスト(数値) {
  this.number + num を返す
}

コンソール.log(test.call(obj, 1)) // 2

コンソール.log(test.apply(obj, [2])) // 3

foo = test.bind(obj, 3) とします。
コンソール.log(foo()) // 4

JavaScript のこのポインティング問題の詳細なケースに関するこの記事はこれで終わりです。JavaScript のこのポインティング問題に関する関連コンテンツをさらにご覧になりたい場合は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続きご覧ください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。