apply() と call()_javascript スキルの違いと関係を明確にする-jsチュートリアル-php.cn

apply() と call()_javascript スキルの違いと関係を明確にする

WBOY

リリース： 2016-05-16 18:03:29

オリジナル

981 人が閲覧しました

JavaScript という自由で常に変化し続ける言語を学ぶ過程でこの感覚に出会ったら、これからは「偏見」を捨ててください、これはあなたにとって間違いなく新しい世界なのですから、JavaScript をゆっくりと溶かしてください。
さて、本題に戻りましょう。この機能は主に apply メソッドと call メソッドの使用に反映されています。 🎜>apply と call を区別するには、

コードをコピーしますコードは次のとおりです:

foo .call(this, arg1,arg2,arg3) == foo.apply(this, argument)==this.foo(arg1, arg2, arg3) 

 

call、すべて適用Function.prototype に属します。これは JavaScript エンジンによって内部的に実装されます。これは Function.prototype に属するため、各 Function オブジェクトのインスタンス、つまり各メソッドはメソッドの属性であるため、call 属性と apply 属性を持ちます。 use はもちろんメソッドに関するものです。これら 2 つのメソッドは同じ機能を持つため混同しやすいですが、単に使用方法が異なるだけです。
類似点: 2 つのメソッドの効果はまったく同じです。
違い: 渡されるメソッドパラメータが異なります
では、メソッドの役割と、メソッドによって渡されるパラメータは何ですか?
foo.call(this, arg1, arg2, arg3) を分析してみましょう。上記の
foo はメソッドです。これはメソッドが実行されるときのコンテキスト関連オブジェクトです。arg1、arg2、arg3 はメソッドが実行されるときに foo メソッドに渡される、いわゆるコンテキスト関連オブジェクトです。ここで、オブジェクト指向プログラミングの基礎があれば、それは簡単に理解できます。これは、変換されたオブジェクトのクラスインスタンスにあります。
JavaScript では、コードは常にコンテキストオブジェクトを持ち、コードはそれを処理します。コンテキストオブジェクトは this 変数によって表され、この this 変数は常に現在のコードが配置されているオブジェクトを指します。
これが何であるかをよりよく理解するために、例を示します。

コードをコピーしますコードは次のとおりです: /クラス A を作成

function A(){

//クラスがインスタンス化されると、次のコードが実行されます
//このときの実行コンテキスト オブジェクトは、現在のインスタンスです Object 
this.message = "message of a" 
this.getMessage = function(){ 
return this.message; 
} 
//クラス A インスタンス オブジェクトを作成します 
var a = new A(); >// クラス インスタンスの getMessage メソッドを呼び出してメッセージ値を取得します 
alert(a.getMessage()); 
// クラス B
 関数 B() を作成します{ 
this.message = "message of b"; 
this.setMessage = function(msg){ 
this.message = msg; 
} 
 //クラス B インスタンス オブジェクトを作成します 
var a = new B(); 

 
余談: JavaScript オブジェクトのすべてのプロパティはパブリック (パブリック) であり、プライベート (プライベート) などというものは存在しないため、メッセージ属性 alert(a.message); 
 クラス A と B はどちらも message 属性 (オブジェクト指向の用語ではメンバー) を持ち、A にはメッセージを取得するための getMessage メソッドがあり、B には setMessage があることがわかります。メッセージを設定するメソッドを以下に示します。

コードをコピーします。

コードは次のとおりです。 >

// b の setMessage メソッドをオブジェクト a に動的に割り当てます。 b.setMessage.call(a, "a's message"); / / 以下は、「a のメッセージ」を表示します。 alert(a.getMessage()); // a の getMessage メソッドをオブジェクト b に動的に割り当てます。

これが動的言語 JavaScript 呼び出しの威力です!

 オブジェクトのメソッドは任意に割り当てることができますが、オブジェクト自体にはそのようなメソッドが存在しないことに注意してください。平たく言うと、メソッドはタスクを完了するために別のオブジェクトの呼び出しに貸し出されます。原則として、メソッドが実行されるとコンテキスト オブジェクトが変更されます。つまり、 b.setMessage.call(a, "a's. message"); は a を実行時間として使用するのと同等です コンテキスト オブジェクトは b オブジェクトの setMessage メソッドを呼び出しますが、このプロセスは b とは何の関係もありません。この関数は a.setMessage("a's message"); と同等です。 
apply と call は同じ効果があるため、次のことができます。
call と apply の機能は、自分のメソッドを呼び出すのと同じように、他の人のメソッドを借りて呼び出すことです。
わかりました。call と apply の類似点は理解しました。 apply--それらが機能した後、それらの違いを見てみましょう。上記を読んだ後は、おそらく例を知っていると思います。
 b.setMessage.call(a, "a's message") は a.setMessage と同等です。 (「a のメッセージ」) を見ると、「a のメッセージ」が 
 のパラメータとして渡されていることがわかります。では、apply ではどのように表現されるのでしょうか。Apply はアプリケーションと組み合わせる必要があるため、直接説明するとわかりません。一目でわかるように、アプリケーション シナリオを設計してみましょう: 

コードをコピーします

コードは次のとおりです:

 
function print(a, b, c, d){ 
alert(a b c d); 
} 
function example(a, b, c, d){ 
// call メソッドを使用して print を借用し、パラメータを明示的に分割して渡します。
print.call(this, a, b, c, d);//apply メソッドを使用して print を借用します。パラメータは配列として渡されます。 
 //ここでは、引数配列を JavaScript メソッドで直接使用します 
print.apply(this, argument) 
// または配列にカプセル化します 
print .apply(this, [a, b, c, d]); 
} 
//「バックライト スクリプト」は 
example("back", "light", "feet") の下に表示されます, "this"); 

 

このシナリオでは、メソッド例では、a、b、c、d がメソッドによって渡されるパラメーターとして使用され、メソッドはそれぞれ apply と call を使用して、
最後の文は、サンプルメソッドが直接呼び出されるため、このメソッドの context オブジェクトは window オブジェクトです。
したがって、call メソッドと apply メソッドの最初のパラメータを除きます。実行時のコンテキストオブジェクトであるため、呼び出しメソッドの他のパラメータは順番に借用メソッドにパラメータとして渡されます。Applyにはパラメータが2つしかなく、2番目のパラメータは配列として渡されます。 apply メソッドの違いは、2 番目のパラメータから順番に、call メソッドのパラメータがパラメータとして渡されることです。Apply はこれらのパラメータを配列に直接入れて渡します。最後に借りたメソッドのパラメータリストは同じです。

アプリケーションシナリオ:
パラメータが明確な場合は call が使用でき、パラメータが不明な場合は apply が使用できます。引数を与える

コードをコピーコードは次のとおりです:

//例

print.call (window, "back", "light", "foot", "this"); 
// foo パラメータは複数の 
function foo(){ 
print.apply(window, argument) ; >} 