js関数では、this指向問題およびcall()、apply()、bind()の使い方について
2058 ワード
1.js関数でのthis指向について
ES 6の矢印関数では、矢印関数は自分のthisがなく、そのthisは継承されます.デフォルトでは、それを定義する時に、オブジェクト(宿主オブジェクト)ではなく、実行時のオブジェクトを指しています.ない場合は、Windowsに至るまで、インターネット上で検索されます.
2.call()、appy()、bind()の使い方
call、bind、appyの状況を比較します.
コール 、ビッド 、 appy この3つの関数の最初のパラメータはすべてです. this のオブジェクトを指します
2番目のパラメータ:
コール のパラメータは直接入れます.第二、第三です. n つのパラメータをすべてカンマで区切って、そのまま後ろに置いてください.
appy のすべてのパラメータは一つの配列の中に入れなければなりません.
ビッド 戻るのが関数である以外は、 のパラメータと コール 同じです
もちろん、三者のパラメータは限定されません. ストリングス 関数を含むさまざまなタイプが許可されます. 、 object など
var name = " ";
var obj = {
name: " ",
es5fun: function () {
console.log(this);
},
es6fun: () => {
console.log(this);
},
};
obj.es5fun(); //obj
obj.es6fun(); //window
console.log(this); //window
ES 5において、関数を対象とする方法で呼び出した場合、thisは呼び出しの対象を指します.ES 6の矢印関数では、矢印関数は自分のthisがなく、そのthisは継承されます.デフォルトでは、それを定義する時に、オブジェクト(宿主オブジェクト)ではなく、実行時のオブジェクトを指しています.ない場合は、Windowsに至るまで、インターネット上で検索されます.
2.call()、appy()、bind()の使い方
var obj = {
name: " ",
age: 99,
myfun: function () {
console.log(this.name + " " + this.age);
},
};
var otherObj = {
name: "yasuo",
age: 4,
};
obj.myfun(); // 99
obj.myfun.call(otherObj); //yasuo 4
obj.myfun.apply(otherObj); //yasuo 4
obj.myfun.bind(otherObj)(); //yasuo 4
call()、appy()、bind()はいずれもthisというオブジェクトを再定義するためのものです.言い換えれば、オブジェクトが他のオブジェクト方法を呼び出す方法であってもよい.call、bind、appyの状況を比較します.
var obj = {
name: " ",
age: 99,
myfun: function (kill, death) {
console.log(" :" + this.name + " :" + this.age + " :" + kill + " :" + death);
},
};
var otherObj = {
name: "yasuo",
age: 4,
};
obj.myfun.call(otherObj, '0', '10'); // :yasuo :4 :0 :10
obj.myfun.apply(otherObj, ['0', '10']); // :yasuo :4 :0 :10
obj.myfun.bind(otherObj, '0', '10')(); // :yasuo :4 :0 :10
最初のパラメータ:コール 、ビッド 、 appy この3つの関数の最初のパラメータはすべてです. this のオブジェクトを指します
2番目のパラメータ:
コール のパラメータは直接入れます.第二、第三です. n つのパラメータをすべてカンマで区切って、そのまま後ろに置いてください.
appy のすべてのパラメータは一つの配列の中に入れなければなりません.
ビッド 戻るのが関数である以外は、 のパラメータと コール 同じです
もちろん、三者のパラメータは限定されません. ストリングス 関数を含むさまざまなタイプが許可されます. 、 object など