ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScriptのcallメソッドとapplyメソッドの使い方の比較_基礎知識

JavaScriptのcallメソッドとapplyメソッドの使い方の比較_基礎知識

WBOY
リリース: 2016-05-16 15:45:34
オリジナル
1489 人が閲覧しました

メソッド定義
呼び出しメソッド:
構文: call([thisObj[,arg1[, arg2[, [,.argN]]]]])
定義: オブジェクトのメソッドを呼び出して、現在のオブジェクトを別のオブジェクトに置き換えます。
説明:
call メソッドを使用すると、別のオブジェクトに代わってメソッドを呼び出すことができます。 call メソッドは、関数のオブジェクト コンテキストを初期コンテキストから thisObj で指定された新しいオブジェクトに変更します。
thisObj パラメータが指定されていない場合は、グローバル オブジェクトが thisObj として使用されます。

適用方法:
構文: apply([thisObj[,argArray]])
定義: オブジェクトのメソッドを適用して、現在のオブジェクトを別のオブジェクトに置き換えます。
説明:
argArray が有効な配列でない場合、または引数オブジェクトではない場合、TypeError が発生します。
argArray も thisObj も指定されていない場合は、Global オブジェクトが thisObj として使用され、パラメータを渡すことはできません。

一般的な例
あ、

function add(a,b) 
{ 
 alert(a+b); 
} 
function sub(a,b) 
{ 
 alert(a-b); 
} 
 
add.call(sub,3,1); 
ログイン後にコピー

この例の意味は、sub を add、add.call(sub,3,1) == add(3,1) に置き換えることです。したがって、実行結果は次のようになります。関数は実際にはオブジェクトであり、関数名は Function オブジェクトへの参照です。

b.

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,[]); 
ログイン後にコピー

呼び出しは、animal のメソッドを cat に置いて実行することを意味します。元々、cat には showName() メソッドがありませんでしたが、現在は、animal の showName() メソッドが実行のために cat に置かれているため、this.name は Cat
になります。
c. 継承を実装します

function Animal(name){  
 this.name = name;  
 this.showName = function(){  
  alert(this.name);  
 }  
}  
 
function Cat(name){ 
 Animal.call(this, name); 
}  
 
var cat = new Cat("Black Cat");  
cat.showName(); 
ログイン後にコピー

Animal.call(this) は、このオブジェクトの代わりに Animal オブジェクトを使用することを意味します。 それでは、Cat オブジェクトは、Animal のメソッドとプロパティを直接呼び出すことができるのではないでしょうか。
d. 多重継承

function Class10() 
{ 
 this.showSub = function(a,b) 
 { 
  alert(a-b); 
 } 
} 
 
function Class11() 
{ 
 this.showAdd = function(a,b) 
 { 
  alert(a+b); 
 } 
} 
 
function Class2() 
{ 
 Class10.call(this); 
 Class11.call(this); 
} 
ログイン後にコピー
非常に簡単です。2 つの呼び出しを使用して多重継承を実現します

もちろん、プロトタイプ チェーンを使用するなど、js を継承する他の方法もあります。これはこの記事の範囲外です。ここでは call の使用法についてのみ説明します。 call と apply について言えば、これら 2 つのメソッドは基本的に同じことを意味します。違いは、call の 2 番目のパラメーターは任意の型にできるのに対し、apply の 2 番目のパラメーターは配列または引数である必要があることです。 🎜>
JavaScript の call メソッドと apply メソッドは、主に関数オブジェクトのコンテキスト、つまり関数内で this が指すコンテンツを変更するために使用されます。

呼び出し方法は次のとおりです:

fun.call(obj1, arg1, arg2, ...);
fun.apply(obj2, [arrs]);

ログイン後にコピー
具体的な例:

var Obj1 = {
 name: 'Object1',
 say: function(p1, p2) {
  console.log(this.name + ' says ' + p1 + ' ' + p2);
 }
};

// logs 'Object1 says Good morning'
Obj1.say('Good', 'morning');

var Obj2 = {
 name: 'Object2'
};

// logs 'Object2 says Good afternoon'
Obj1.say.call(Obj2, 'Good', 'afternoon');

// logs 'Object2 says Good afternoon again'
Obj1.say.apply(Obj2, ['Good', 'afternoon again']);

ログイン後にコピー
例からわかるように、従来のメソッドで呼び出した場合、メソッド内の this は Obj1 を指しますが、call と apply で呼び出した場合、メソッド内の this は Obj2 を指します。

例からわかるように、call と apply の機能はまったく同じであり、呼び出し方法の違いはパラメーター リストだけです。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート