JavaScriptの中でcall、apply、bindの方法の総括

why?call、appy、bindは何をしますか?なぜこれを勉強しますか?一般的にはthisを指定する環境に使われていますが、勉強していない前に、これらの問題があります.

var a = {
    user:"   ",
    fn:function(){
        console.log(this.user);
    }
}
var b = a.fn;
b(); //undefined

私たちはオブジェクトaの中のuserをプリントしたいですが、undefinedとはどういうことですか?a.fn()を直接実行すればいいです.

var a = {
    user:"   ",
    fn:function(){
        console.log(this.user);
    }
}
a.fn(); //   

ここで印刷できるのは、ここのthisは関数aを指しています.なぜ上のはaを指していませんか?私達はthisの指向問題を理解する必要があるなら、jsの中でthisの方向を徹底的に理解してください.この文章を無理に暗記する必要はありません.この方法は目的を達成することができますが、このオブジェクトを別の変数に保存しなければならない場合があります.1、コール()

var a = {
    user:"   ",
    fn:function(){
        console.log(this.user); //   
    }
}
var b = a.fn;
b.call(a);

callメソッドでは、最初のパラメータにbをどの環境に追加するかによって、簡単に言えば、thisはそのオブジェクトを指します.
call方法は、最初のパラメータ以外にも複数のパラメータを追加できます.

var a = {
    user:"   ",
    fn:function(e,ee){
        console.log(this.user); //   
        console.log(e+ee); //3
    }
}
var b = a.fn;
b.call(a,1,2);

2、apply()apply方法とcall方法は似ています.thisの方向を変えることもできます.

var a = {
    user:"   ",
    fn:function(){
        console.log(this.user); //   
    }
}
var b = a.fn;
b.apply(a);

同様に、複数のパラメータもありますが、異なるのは、2番目のパラメータは1つの配列でなければなりません.

var a = {
    user:"   ",
    fn:function(e,ee){
        console.log(this.user); //   
        console.log(e+ee); //11
    }
}
var b = a.fn;
b.apply(a,[10,1]);

または

var a = {
    user:"   ",
    fn:function(e,ee){
        console.log(this.user); //   
        console.log(e+ee); //520
    }
}
var b = a.fn;
var arr = [500,20];
b.apply(a,arr);

//もしcallとappyの最初のパラメータがnullと書いたら、thisはwindowの対象を指します.

var a = {
    user:"   ",
    fn:function(){
        console.log(this); //Window {external: Object, chrome: Object, document: document, a: Object, speechSynthesis: SpeechSynthesis…}
    }
}
var b = a.fn;
b.apply(null);

3、bind()の方法とcall、applyの方法は少し違っていますが、いずれにしてもthisの指向を変えるために使えます.
まず、その違いを説明しましょう.

var a = {
    user:"   ",
    fn:function(){
        console.log(this.user);
    }
}
var b = a.fn;
b.bind(a);

コードは印刷されていないことが分かりました.これはbindとcall、applyの方法の違いです.実際にbindの方法は修正された関数です.

var a = {
    user:"   ",
    fn:function(){
        console.log(this.user);
    }
}
var b = a.fn;
var c = b.bind(a);
console.log(c); //function() { [native code] }

じゃ、関数cを実行してみます.オブジェクトaの中のuserをプリントアウトできますか?

var a = {
    user:"   ",
    fn:function(){
        console.log(this.user); //   
    }
}
var b = a.fn;
var c = b.bind(a);
c();

ok、同じビッドにも複数のパラメータがあり、またパラメータを実行する際に追加することができますが、パラメータはイメージ順に行うことに注意してください.

var a = {
    user:"   ",
    fn:function(e,d,f){
        console.log(this.user); //   
        console.log(e,d,f); //10 1 2
    }
}
var b = a.fn;
var c = b.bind(a,10);
c(1,2);

まとめ:callとappyは文脈のthisを変えてすぐにこの関数を実行します.bind方法は対応する関数にいつまで調整したいならいつ呼び出しますか?そしてパラメータを実行する時に追加できます.これは違いです.自分の実際の状況によって選択して使います.