javascript中call()、appy()、bind()の使い方を話します.
3545 ワード
call(thisObj,arg 1,arg 2…)、appy(thisObj,[Obj 1,Obj 2...])の2つの方法は、関数ごとに含まれる非継承の方法です.
call(thisobj[,args])とappy(thisobj[,args])
作用はすべて同じで、簡単に言えば、現在この方法を使用しているオブジェクトのthis指向を変更し、呼び出し方法のthisObjオブジェクトの違い(最初のパラメータは同じです.)を指しているのは、callメソッドに入力されたパラメータは一つずつ列挙されています.
例を挙げて説明するのが直感的です.
例:
彼らの違いを見てみましょう.
JSでは、この3つは関数を変えるためのthisオブジェクトの指向です.彼らはどのような違いがありますか?違いを言う前に、まず3つの似ているところをまとめます.1、関数を変えるためのthisオブジェクトの方向です.2、最初のパラメータはすべてthisが指す対象です.3、後続のパラメータを利用して参照することができます.彼らの違いはどこにありますか?まず例を見てください. var xw={ name:「王さん」、 gender:「男」、 age:24、 say:function(){ alert(this.name+","+this.gender+"今年"+this.age); } } var xh={ name:「紅ちゃん」、 gender:「女」、 age:18 } xw.say();自分は何も言いません.表示されているのは王さん、男です.今年の24歳です.
では、どのようにxwのsay方法でxhのデータを表示しますか?
コールに対してはこのようにすることができます.
call(thisobj[,args])とappy(thisobj[,args])
作用はすべて同じで、簡単に言えば、現在この方法を使用しているオブジェクトのthis指向を変更し、呼び出し方法のthisObjオブジェクトの違い(最初のパラメータは同じです.)を指しているのは、callメソッドに入力されたパラメータは一つずつ列挙されています.
例を挙げて説明するのが直感的です.
window.color='red';
var o={color:"blue"};
function sayColor(){
alert(this.color);
};
sayColor(); //red( ,this window)
sayColor.call(this);//red( call , this, this window, )
sayColor.call(window);//red( call , window, )
sayColor.call(o); //blue ( call , o, this o, window o)
sayColor.apply(o);//blue ( call , o, this o, window o)
ECMAScript 5におけるbind()方法は前の2つの方法と同様であり、bind()この方法は関数の一例を作成し、この例のthis値はbind()関数に渡す値にバインドされる.例:
function a(y){
return this.x+y;
};
var o={x:1};
var g=a.bind(o);
g(2);//3
例えば、関数aがオブジェクトoに紐付けされていて、新しい関数gが返ってきます.gを呼び出すと、a関数はオブジェクトoの方法として呼び出されます. bind()この方法は、関数をあるオブジェクトに結びつけ、新しい関数を返します.この新しい関数に入ってきたパラメータは、バインディングされた関数に導入されます.彼らの違いを見てみましょう.
JSでは、この3つは関数を変えるためのthisオブジェクトの指向です.彼らはどのような違いがありますか?違いを言う前に、まず3つの似ているところをまとめます.1、関数を変えるためのthisオブジェクトの方向です.2、最初のパラメータはすべてthisが指す対象です.3、後続のパラメータを利用して参照することができます.彼らの違いはどこにありますか?まず例を見てください. var xw={ name:「王さん」、 gender:「男」、 age:24、 say:function(){ alert(this.name+","+this.gender+"今年"+this.age); } } var xh={ name:「紅ちゃん」、 gender:「女」、 age:18 } xw.say();自分は何も言いません.表示されているのは王さん、男です.今年の24歳です.
では、どのようにxwのsay方法でxhのデータを表示しますか?
コールに対してはこのようにすることができます.
xw.say.call(xh);
アプリについては、このようにすることができます.
xw.say.apply(xh);
これは、ビンにとって必要である.
xw.say.bind(xh)();
直接xw.say.bind(xh)を書くと何の結果もないですが、違いが見られますか?callとappyは関数の直接呼び出しですが、bindメソッドはまだ関数ですので、後から呼び出しが必要です.では、callとappyはどのような違いがありますか?例を少し書き換えます.
var xw = {
name : " ",
gender : " ",
age : 24,
say : function(school,grade) {
alert(this.name + " , " + this.gender + " , " + this.age + " , " + school + " " + grade);
}
}
var xh = {
name : " ",
gender : " ",
age : 18
}
say法には二つのパラメータが多く見られます.私たちはcall/applyのパラメータで参席します.callにとってはこのようになります.
xw.say.call(xh," "," ");
アプリにとってはこんな感じです.
xw.say.apply(xh,[" "," "]);
違いを見ましたか?callの後ろのパラメータとsayの方法は一対一で対応していますが、appyの二番目のパラメータは一列で、配列の中の要素はsayの方法と対応しています.これは両者の最大の違いです.bindはどうやって伝えられますか?callのように伝えられます.
xw.say.bind(xh," "," ")();
しかし、ビッドが戻ってきたのはまだ関数ですので、呼び出し時にまた転送できます.
xw.say.bind(xh)(" "," ");
以上述べましたが、本文の内容は全部です.お好きになってください.