Comprendre la différence entre appeler et postuler en JavaScript

Utilisation des méthodes d'appel et d'application en JavaScript pour l'invocation de fonction

Script frontal JavaScript

// Example 1: Using Function.prototype.call()
const person = {
    fullName: function() {
        return this.firstName + " " + this.lastName;
    }
};
const person1 = {
    firstName: "John",
    lastName: "Doe"
};
const person2 = {
    firstName: "Jane",
    lastName: "Smith"
};
// Call the fullName method on person1 and person2
console.log(person.fullName.call(person1)); // Output: John Doe
console.log(person.fullName.call(person2)); // Output: Jane Smith

Application de Function.prototype.apply() pour une transmission d'arguments flexible

Script frontal JavaScript

// Example 2: Using Function.prototype.apply()
const person = {
    fullName: function(city, country) {
        return this.firstName + " " + this.lastName + ", " + city + ", " + country;
    }
};
const person1 = {
    firstName: "John",
    lastName: "Doe"
};
const person2 = {
    firstName: "Jane",
    lastName: "Smith"
};
// Apply the fullName method with arguments on person1 and person2
console.log(person.fullName.apply(person1, ["New York", "USA"])); // Output: John Doe, New York, USA
console.log(person.fullName.apply(person2, ["London", "UK"])); // Output: Jane Smith, London, UK

Exemple de backend Node.js utilisant call et apply

Script back-end JavaScript avec Node.js

// Load the required modules
const http = require('http');
// Create a server object
http.createServer((req, res) => {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    // Example using call()
    function greet() {
        return 'Hello ' + this.name;
    }
    const user = { name: 'Alice' };
    res.write(greet.call(user)); // Output: Hello Alice
    res.end();
}).listen(3000);
console.log('Server running at http://localhost:3000/');

Combiner appel et candidature avec une fonction dynamique

Script JavaScript complet

// Define a function to display user details
function displayDetails(age, profession) {
    return this.name + " is " + age + " years old and works as a " + profession + ".";
}
// User objects
const user1 = { name: 'Bob' };
const user2 = { name: 'Alice' };
// Use call to invoke displayDetails
console.log(displayDetails.call(user1, 30, 'Engineer')); // Output: Bob is 30 years old and works as a Engineer.
// Use apply to invoke displayDetails
console.log(displayDetails.apply(user2, [28, 'Doctor'])); // Output: Alice is 28 years old and works as a Doctor.

Questions courantes sur l'appel et la candidature en JavaScript

1. Quelle est la principale différence entre call() et apply()?
2. La principale différence est que call() accepte une liste d'arguments, tandis que apply() accepte un éventail d’arguments.
3. Quand devriez-vous utiliser apply() sur call()?
4. Tu devrais utiliser apply() lorsque vous disposez d’un tableau d’arguments ou que vous devez transmettre un nombre variable d’arguments à une fonction.
5. Y a-t-il des différences de performances entre call() et apply()?
6. En général, il n'y a pas de différences de performances significatives entre call() et apply(). Les différences sont généralement négligeables.
7. Peut apply() être utilisé avec les méthodes mathématiques ?
8. Oui, apply() peut être utilisé pour transmettre un tableau de nombres à des méthodes mathématiques telles que Math.max() ou Math.min().
9. Qu'est-ce que Function.prototype.bind()?
10. bind() crée une nouvelle fonction qui, lorsqu'elle est appelée, a son this mot-clé défini sur la valeur fournie, avec une séquence donnée d'arguments précédant ceux fournis lorsque la nouvelle fonction est appelée.
11. Comment puis call() être utilisé pour emprunter des méthodes ?
12. Vous pouvez utiliser call() pour emprunter des méthodes à un objet et les utiliser sur un autre objet, permettant la réutilisation des méthodes sans copier la fonction.
13. Est-il possible d'utiliser call() ou apply() avec les constructeurs ?
14. Non, les constructeurs ne peuvent pas être appelés directement avec call() ou apply(). Au lieu de cela, vous pouvez utiliser Object.create() pour les modèles d’héritage.
15. Que sont les objets de type tableau et comment faire call() et apply() travailler avec eux ?
16. Les objets de type tableau sont des objets qui ont une propriété de longueur et des éléments indexés. call() et apply() peut être utilisé pour manipuler ces objets comme s’il s’agissait de tableaux.

Résumer l'utilisation de call et apply en JavaScript

En JavaScript, call() et apply() sont essentiels pour contrôler this contexte au sein des fonctions. call() permet de transmettre des arguments individuels, ce qui le rend adapté aux arguments connus et fixes. En revanche, apply() prend un tableau d'arguments, offrant une flexibilité pour les listes d'arguments variables. Les deux méthodes améliorent la réutilisabilité du code et l'invocation dynamique de fonctions, que ce soit dans le développement frontend ou dans les environnements Node.js. Comprendre quand et comment utiliser efficacement ces méthodes est crucial pour écrire du code JavaScript propre et efficace.