JSのcallとappyはどう分かりますか?

4651 ワード

1.背景紹介
callとapplyはいずれも、ある関数が動作するときのcontextすなわちコンテキストを変えるために存在し、言い換えれば、関数体内部のthisの指向を変えるためである.JavaScriptの関数には「定義時文脈」と「実行時文脈」と「文脈は変えられます」という概念があるからです.
2.知識分析
2.1 appy:
方法は他のオブジェクトをハイジャックする方法で、他のオブジェクトの属性を継承します.
Function.apply(obj,args)方法は二つのパラメータを受信できます.
このオブジェクトは、Functionクラスのthisオブジェクトの代わりになります.
args:これは配列で、パラメータとしてFunctionに伝えられます.
2.2コール
アプリと同じ意味ですが、パラメータリストが違います.
Function.call(obj,[param 1[,param 2[,paramN]]])
このオブジェクトは、Functionクラスのthisオブジェクトの代わりになります.
params:これはパラメータリストです.
3.よくある問題
callとappyはどう使いますか?
4.ソリューション
callとapplyの役割は基本的に似ています.functionを実行して、このfunctionのcontextを最初のパラメータに置き換えて持ち込みます.
両者の違いは、callがfunctionのパラメータを一つずつ持ち込む必要がありますが、applyは二つ目のパラメータで一つの数列に持ち込めばいいです.
function fn( arg1, arg2,... ){
// do something
}
fn( arg1, arg2,... );
fn.call( context, arg1, arg2,... );
fn.apply( context, [ arg1, arg2,... ]);
コールの方法
オブジェクトを別のオブジェクトに置き換える方法を呼び出します.
call([thisObj],arg 1[,arg 2[,  [..argN]]]
パラメータ
thisObj
オプションを選択します.現在のオブジェクトとして使用されます.
arg 1、arg 2、  , argN
オプションを選択します.転送される方法のパラメータ系列を指定します.
説明
コール方法は、他のオブジェクトの代わりに一つの方法を呼び出すために使用されてもよい.call方法は、関数のオブジェクトコンテキストを初期のコンテキストから、thisObjによって指定された新しいオブジェクトに変更することができる.
thisObjパラメータが提供されていない場合、GlobalオブジェクトはthisObjとして使用される.
var func=new function(){this.a="func"}
var newfunc=function(x){
var a="newfunc";
alert(this.a);
alert(x);
}
newfunc.call(func,"inputParameter1");
/*alert are
* func/inputParameter1; not newfunc/inputParameter1
*/
以上の例から分かるように、alertは現在の関数の値ではないことを返します.
コールを使って実行するのは少し早いですが、違いはあまりありません.
demo 1:
/*      */
function Person(name,age)
{
this.name=name;
this.age=age;
}
/*       */
function Student(name,age,grade)
{
Person.apply(this,arguments);
//Person.call(this,name,age);
this.grade=grade;
}
//       
var student=new Student("zhangsan",21,"   ");
//  
alert("name:"+student.name+"
"+"age:"+student.age+"
"+"grade:"+student.grade);
//          name:zhangsan age:21  grade:   
//         name age     ,              ,    apply     .
Person.apply(this,arguments);
this:オブジェクトを作成する時はstudentです.
argments:行列です.つまり「zhangsan」、「21」、「一年生」です.
つまり、StudentでPersonというカテゴリーの内容を実行し、Personというカテゴリーにthis.nameなどの語句があり、これでstudentオブジェクトに属性を作成します.
demo 2
function Animal(){
this.name = "Animal";
this.showName = function(){
alert(this.name);
}
}
function Cat(){
this.name = "Cat";
}
var animal = new Animal();
var cat = new Cat();
//  call apply  ,     Animal   showName()      cat    。
//     "Cat"
animal.showName.call(cat,",");
//animal.showName.apply(cat,[]);
callとはanimalの方法をcatに置いて実行するという意味です.元々はcatはshowNameの方法がないので、今はanimalのshowNameの方法をcatに置いて実行します.だから、this.nameはCatであるべきです.
5.コード実戦
6.考えを広げる
callとappyの違いは?
同じ点:二つの方法が生み出す役割は全く同じです.
異なる点:方法伝達のパラメータが異なる
call()はパラメータリストを受け取りますが、appy()はパラメータ配列を受け入れます.
func.call(this,arg 1,arg 2)
func.apply(this,[arg 1,arg 2])
その中のthisはあなたが指定したい文脈です.彼はどのJavaScriptオブジェクトでもいいです.コールはパラメータを順番に渡す必要があります.したがって、適用条件といえば、あなたのパラメータが明確に数量を知っている時にコールを使います.不確定な時はappyでパラメータpshを配列に送ります.
栗を挙げて、callとappyを区別します.
行列の最大値と最小値を取得します.
var  numbers = [5, 458 , 120 , -215 ];
Math.max.apply(Math, numbers);
Math.max.call(Math,5, 458 , 120 , -215);
7.参考文献
参考一:js中bind、call、appy関数の使い方
参考二:Jsアプリ方法詳細
参考3:Javascript中call,appy,bind方法の詳細とまとめ