Розуміння різниці між викликом і застосуванням у JavaScript

Використання методів виклику та застосування в JavaScript для виклику функції

Сценарій інтерфейсу 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

Застосування Function.prototype.apply() для гнучкої передачі аргументів

Сценарій інтерфейсу 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

Приклад серверної частини Node.js Використання виклику та застосування

Скрипт серверної частини JavaScript із 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/');

Поєднання виклику та застосування з динамічною функцією

Скрипт повного стеку JavaScript

// 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.

Поширені запитання про виклик і застосування в JavaScript

1. У чому головна відмінність між call() і apply()?
2. Основна відмінність полягає в тому, що call() приймає список аргументів, поки apply() приймає набір аргументів.
3. Коли слід використовувати apply() закінчено call()?
4. Ви повинні використовувати apply() коли у вас є масив аргументів або потрібно передати змінну кількість аргументів у функцію.
5. Чи є відмінності в продуктивності між call() і apply()?
6. Як правило, між ними немає істотних відмінностей у продуктивності call() і apply(). Будь-які відмінності зазвичай незначні.
7. може apply() використовувати з математичними методами?
8. так, apply() можна використовувати для передачі масиву чисел у математичні методи, наприклад Math.max() або Math.min().
9. Що Function.prototype.bind()?
10. bind() створює нову функцію, яка під час виклику має свій this ключове слово має надане значення із заданою послідовністю аргументів, що передує будь-якому наданому під час виклику нової функції.
11. Як можна call() використовуватися для запозичення методів?
12. Ви можете використовувати call() запозичувати методи з одного об’єкта та використовувати їх на іншому об’єкті, дозволяючи повторне використання методу без копіювання функції.
13. Чи можна використовувати call() або apply() з конструкторами?
14. Ні, конструктори не можна викликати напряму call() або apply(). Замість цього можна використовувати Object.create() для шаблонів успадкування.
15. Що таке масивоподібні об’єкти та як це зробити call() і apply() працювати з ними?
16. Масивоподібні об’єкти – це об’єкти, які мають властивість length та індексовані елементи. call() і apply() можна використовувати для маніпулювання цими об’єктами, як якщо б вони були масивами.

Короткий огляд використання call і apply у JavaScript

У JavaScript, call() і apply() необхідні для контролю this контекст у функціях. call() дозволяє передавати окремі аргументи, що робить його придатним для відомих і фіксованих аргументів. У контрасті, apply() приймає масив аргументів, забезпечуючи гнучкість для списків змінних аргументів. Обидва методи підвищують можливість повторного використання коду та динамічний виклик функцій, незалежно від того, чи є у розробці інтерфейсу чи середовищі Node.js. Розуміння того, коли та як ефективно використовувати ці методи, має вирішальне значення для написання чистого та ефективного коду JavaScript.