Explication détaillée de la différence entre apply et call en JavaScript

Cet article présente principalement les connaissances pertinentes sur l'application et l'appel en JavaScript. A une très bonne valeur de référence. Jetons un coup d'œil à la différence entre

apply et call

La spécification ECMAscript définit à la fois call et apply pour toutes les fonctions méthodes, leurs applications sont très larges, leurs fonctions sont exactement les mêmes, seule la forme des paramètres de passage est différente.

apply()

la méthode apply passe en deux paramètres : l'un est l'objet en tant que contexte de fonction et l'autre est l'objet en tant que contexte de fonction. le paramètre de fonction. Tableau composé de.

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

Comme vous pouvez le voir, obj est l'objet utilisé comme contexte de fonction, et cela dans la fonction func pointe vers l'objet obj. Les paramètres A et B sont placés dans le tableau et transmis à la fonction func, correspondant respectivement aux éléments de liste du paramètre func.

call()

Le premier paramètre de la méthode d'appel est également l'objet du contexte de la fonction, mais ce qui est transmis plus tard est une liste de paramètres plutôt qu’un seul tableau.

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

En comparant apply, nous pouvons voir la différence. C et D sont transmis à la fonction func en tant que paramètres séparés au lieu d'être placés dans un tableau.

Il n'y a pas lieu de s'inquiéter de savoir quand utiliser quelle méthode. Si vos paramètres existent déjà dans un tableau, utilisez naturellement apply. Si les paramètres sont dispersés et n'ont aucune corrélation entre eux, utilisez call.

Utilisation de postuler et d'appeler

1. Modifiez ceci pour pointer vers

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

us Comme vous le savez, le premier paramètre de la méthode d'appel est l'objet comme contexte de fonction. Ici, obj est passé à func en tant que paramètre. À ce stade, ceci dans la fonction pointe vers l'objet obj. La fonction func ici est en fait équivalente à

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

2. Emprunter des méthodes à d'autres objets

Regardez d'abord l'exemple

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

De ce qui précède, nous pouvons voir que l'objet personne instancié par Person2 obtient le nom dans Person1 via la méthode getname. Parce que dans Person2, la fonction de Person1.call(this) est d'utiliser l'objet Person1 au lieu de cet objet, alors Person2 a tous les

attributs et méthodes dans Person1, ce qui équivaut à Person2 héritant Les propriétés et méthodes de Person1.

3. Appel de fonctions

Les méthodes apply et call entraîneront l'exécution immédiate de la fonction, elles peuvent donc également être utilisées pour appeler des fonctions. .

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

La différence entre call et bind

Une méthode appelée bind a été étendue dans Ecmascript5, qui n'est pas compatible avec les versions inférieures d'IE. C'est très similaire à call. Il accepte deux parties de paramètres. La première partie du paramètre est l'objet utilisé comme contexte de fonction et la deuxième partie du paramètre est une liste qui peut accepter plusieurs paramètres.

Les différences entre eux sont les suivantes.

1.bind La valeur de retour est la fonction

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

la méthode bind ne sera pas exécutée immédiatement, mais renverra un contexte modifié cette fonction après. Cependant, cela dans la fonction d'origine func n'a pas été modifié et pointe toujours vers la fenêtre d'objet global.

2. L'utilisation des paramètres

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

l'appel consiste à transmettre le deuxième paramètre et les suivants en tant que paramètres réels de la méthode func, et les paramètres réels de la méthode func1 sont en fait organisés sur la base des paramètres de bind.

Il n'y a pas de méthode de liaison dans les navigateurs de versions inférieures, nous pouvons également en implémenter une nous-mêmes.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!