一般的に、何か概念があれば、できるだけ正確に把握してスキップします.これは時間がかかりましたが.この程度で私はもう私のレベルを知っています.スキップしても大丈夫!やってない感じそこで、thisが見られる主な状況で、thisがどのように使われているのかをまとめ、今からスキップします.

1.概念

これは、関数の実行時に呼び出されるメソッドによって決定される特殊なオブジェクトです.これは、関数の実行時に決定されます.これは、実行コンテキスト(context)に依存し、固定されているわけではありません.

2.主な脈絡

基本レベルで簡単なコード脈絡を構築し、thisの意味を理解します.

2.1方法

const obj = {
  func: function() {
    console.log(this)
  }
}

obj.func(); // obj

上記のメソッドのコンテキストでthisを使用すると、そのオブジェクトが表示されます.
したがってobjfunc()はobjを出力します.

2.2例

function MyInfo(name, age) {
  this.name = name;
  this.age = age;
}

const me = new MyInfo("Crom", 20);
const you = new MyInfo("neo", 25);

console.log(me.name) // "Crom"
console.log(you.name) // "neo"

コンストラクション関数MyInfoを作成し、meとyouの2つのインスタンスを作成しました.
この場合、thisはこのインスタンスを指します.
私の例では、this-->MyInfo {name: "Crom", age: 20}
あなたの例では、this-->MyInfo {name: "neo", age: 25}

2.3 call, apply, bind

const obj = { name: 'Crom" }

const fav = function(song) {
  console.log(`${this.name} likes ${song}`)
}

fav.call(obj, "Ultramania"); // "Crom likes Ultramania"
fav.apply(obj, ["Moai"]); // "Crom likes Moai"

const binded = fav.bind(obj)
binded("take five"); // "Crom likes take five"

call、apply、bindの3つは、これを私が指定した目標に固定する関数です.

3つのパラメータはいずれもthisで1番目に入力したパラメータを固定し、2番目のパラメータからfav関数に渡されるパラメータを含む.伝達するパラメータが複数である場合、applyはcallとapplyの違いである配列で入力する必要があります.

callとapplyは関数を実行し、bindは関数を実行せず、この値だけを固定します.この点はbindがcall,applyと区別される特徴に相当する.

callなどの関数を使用せずにfav関数を実行すると、この関数は関数内部でバインドされません.これは、グローバルオブジェクトwindowであることを意味します.

2.4一般関数と矢印関数

function notBinding() {
  console.log(this)
}

notBinding(); // Window


const arrow = () => console.log(this)

arrow(); // Window

一般的な関数では、thisは内部にバインドできません.これは、グローバルオブジェクトウィンドウを意味します.

矢印関数で使用されるthisも何の意味もなく、Windowを表します.

上記の2つの場合にthisを使用すると、コードが間違っている可能性が高いという.何の役にも立たないから、簡単に見てください.