Maison >interface Web >js tutoriel >Simplifier l'appel, l'application et la liaison en JavaScript
JavaScript vous permet de modifier le contexte (cette valeur) des fonctions en utilisant call, apply et bind. Ces méthodes peuvent sembler délicates au début, mais avec quelques exemples simples et des analogies réelles, vous les comprendrez. Décomposons-les.
Considérez l'appel comme un moyen d'emprunter une méthode à un objet et de l'utiliser avec un autre objet.
Imaginez que vous ayez une application pour smartphone qui vérifie votre emploi du temps. Votre ami possède également la même application mais n’a pas configuré son emploi du temps. Vous pouvez prêter temporairement la configuration de votre application à votre ami afin qu'il puisse voir comment cela fonctionne avec son emploi du temps.
const person1 = { firstName: 'John', lastName: 'Doe', fullName: function() { console.log(this.firstName + ' ' + this.lastName); } }; const person2 = { firstName: 'Jane', lastName: 'Smith' }; person1.fullName.call(person2); // Outputs: Jane Smith
Ici, person1 a une méthode pour imprimer son nom complet. En utilisant call, person2 peut emprunter cette méthode et imprimer son propre nom complet.
apply est similaire à call, mais il prend les arguments sous forme de tableau.
Imaginez que vous êtes dans un restaurant en train de commander de la nourriture. Au lieu d'indiquer au serveur chaque article individuellement, vous remettez une liste d'articles au serveur.
function sum(a, b) { console.log(a + b); } sum.apply(null, [5, 10]); // Outputs: 15
Dans cet exemple, apply appelle la fonction somme avec les arguments 5 et 10 fournis sous forme de tableau.
bind crée une nouvelle fonction qui, lorsqu'elle est appelée, a sa valeur this définie sur la valeur fournie. C'est comme prêter en permanence la configuration de votre application à votre ami pour qu'il puisse l'utiliser quand il le souhaite.
Supposons que vous disposiez d'une télécommande TV spéciale qui ne fonctionne qu'avec votre téléviseur. Vous pouvez créer une télécommande en double qui fonctionne de manière permanente avec le téléviseur de votre ami.
const module = { x: 42, getX: function() { return this.x; } }; const retrieveX = module.getX; console.log(retrieveX()); // Outputs: undefined (because 'this' is not module) const boundGetX = retrieveX.bind(module); console.log(boundGetX()); // Outputs: 42
Dans cet exemple, bind crée une nouvelle fonctionboundGetX qui utilise toujours module comme valeur this.
Vous pouvez utiliser call pour emprunter des méthodes à d'autres objets.
const person = { name: 'Alice', greet: function() { console.log('Hello, ' + this.name); } }; const anotherPerson = { name: 'Bob' }; person.greet.call(anotherPerson); // Outputs: Hello, Bob
apply est utile pour transmettre des tableaux à des fonctions comme Math.max.
const numbers = [5, 6, 2, 3, 7]; const max = Math.max.apply(null, numbers); console.log(max); // Outputs: 7
bind peut être utilisé pour créer des fonctions avec des arguments prédéfinis.
function multiply(a, b) { return a * b; } const double = multiply.bind(null, 2); console.log(double(5)); // Outputs: 10
Ici, bind crée une nouvelle fonction double où a vaut toujours 2, ce qui permet de doubler facilement n'importe quel nombre.
Comprendre les appels, les applications et les liaisons vous aide à contrôler la manière dont les fonctions sont exécutées en JavaScript. Ils vous permettent de modifier cette valeur et les arguments prédéfinis, rendant votre code plus flexible et réutilisable. En maîtrisant ces méthodes, vous pouvez écrire du code JavaScript plus propre et plus efficace.
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!