JavaScriptのapplyとcallの違いを詳しく解説

この記事では主にJavaScriptのapplyとcallの関連知識を紹介します。非常に良い基準値を持っています。以下のエディターで見てみましょう

apply と call の違い

ECMAscript 仕様では、すべての関数の call メソッドと apply メソッドが定義されています。これらは広く使用されており、機能はまったく同じですが、唯一の違いは形式です。渡すパラメータの数。

apply( )

apply メソッドは 2 つのパラメーターを渡します。1 つは関数コンテキストとしてのオブジェクト、もう 1 つは関数パラメーターで構成される配列です。

var obj = {
 name : 'linxin'
}
function func(firstName, lastName){
 console.log(firstName + ' ' + this.name + ' ' + lastName);
}
func.apply(obj, ['A', 'B']); // A linxin B

obj が関数コンテキストとして使用されるオブジェクトであり、関数 func 内の this がオブジェクト obj を指していることがわかります。パラメータ A と B は、それぞれ func パラメータのリスト要素に対応して、配列に配置され、func 関数に渡されます。

call( )

call メソッドの最初のパラメータも関数コンテキストのオブジェクトですが、後で渡されるのは単一の配列ではなくパラメータ リストです。

var obj = {
 name: 'linxin'
}
function func(firstName, lastName) {
 console.log(firstName + ' ' + this.name + ' ' + lastName);
}
func.call(obj, 'C', 'D');  // C linxin D

apply を比較すると、C と D が配列に配置されるのではなく、個別のパラメーターとして func 関数に渡されることがわかります。

実際、いつどの方法を使用するかを心配する必要はありません。パラメータがすでに配列に存在する場合は、当然 apply を使用します。パラメータが分散していて相互に相関がない場合は、call を使用します。

apply と call の使用法

1. これを

var obj = {
 name: 'linxin'
}
function func() {
 console.log(this.name);
}
func.call(obj);  // linxin

を指すように変更します。call メソッドの最初のパラメーターが関数コンテキストとしてのオブジェクトであることがわかります。ここでは、obj がパラメーターとして渡されます。 func, このとき、関数内のthisはobjオブジェクトを指します。ここでの func 関数は、実際には

function func() {
 console.log(obj.name);
}

2 と同等です。他のオブジェクトのメソッドを借用してください

まず例を見てください

var Person1 = function () {
 this.name = 'linxin';
}
var Person2 = function () {
 this.getname = function () {
  console.log(this.name);
 }
 Person1.call(this);
}
var person = new Person2();
person.getname();  // linxin

上記から、Person2 によってインスタンス化されたオブジェクト person が、 getname のメソッド名。 PERSON2 では、PERSON1.call(this) の機能は this オブジェクトの代わりに PERSON1 オブジェクトを使用することであるため、PERSON2 は PERSON1 のすべてのプロパティとメソッドを持ち、これは PERSON2 が PERSON1 のプロパティとメソッドを継承するのと同等です。 3. 関数

apply メソッドと call メソッドを呼び出すと、関数がすぐに実行されるため、関数の呼び出しにも使用できます。

function func() {
 console.log('linxin');
}
func.call();   // linxin

callとbindの違い

Ecmascript5ではbindというメソッドが拡張されており、以前のバージョンのIEとは互換性がありません。これは call と非常に似ており、最初のパラメーターは関数コンテキストとしてのオブジェクトを受け取り、パラメーターの 2 番目の部分は複数のパラメーターを受け取ることができます。 両者の違いは以下の2点です。

1.bind は関数を返します

var obj = {
 name: 'linxin'
}
function func() {
 console.log(this.name);
}
var func1 = func.bind(obj);
func1();      // linxin

bind メソッドはすぐには実行されませんが、コンテキストを変更する関数を返します。ただし、元の関数 func の this は変更されておらず、依然としてグローバル オブジェクト ウィンドウを指しています。

2.parameters

function func(a, b, c) {
 console.log(a, b, c);
}
var func1 = func.bind(null,'linxin');
func('A', 'B', 'C');   // A B C
func1('A', 'B', 'C');   // linxin A B
func1('B', 'C');    // linxin B C
func.call(null, 'linxin');  // linxin undefined undefined

callの使用は、2番目以降のパラメータをfuncメソッドの実パラメータとして渡すことであり、func1メソッドの実パラメータはBack rowのパラメータに基づいています。 。 以前のバージョンのブラウザにはバインド メソッドがありません。自分で実装することもできます。 りー

以上がJavaScriptのapplyとcallの違いを詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。