Het verschil begrijpen tussen bellen en solliciteren in JavaScript

Gebruikmaken van aanroep- en toepassingsmethoden in JavaScript voor functie-aanroep

JavaScript frontend-script

// 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() toepassen voor het flexibel doorgeven van argumenten

JavaScript frontend-script

// 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 Backend-voorbeeld Bellen en toepassen gebruiken

JavaScript-backend-script met 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/');

Bellen en solliciteren combineren met een Dynamische Functie

JavaScript Full Stack-script

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

Veelgestelde vragen over bellen en solliciteren in JavaScript

1. Wat is het belangrijkste verschil tussen call() En apply()?
2. Het belangrijkste verschil is dat call() accepteert een lijst met argumenten, terwijl apply() accepteert een reeks argumenten.
3. Wanneer moet je gebruiken apply() over call()?
4. Je zou ... moeten gebruiken apply() wanneer u een array met argumenten heeft of een variabel aantal argumenten aan een functie moet doorgeven.
5. Zijn er prestatieverschillen tussen call() En apply()?
6. Over het algemeen zijn er geen significante prestatieverschillen tussen call() En apply(). Eventuele verschillen zijn doorgaans verwaarloosbaar.
7. Kan apply() worden gebruikt met wiskundige methoden?
8. Ja, apply() kan worden gebruikt om een ​​reeks getallen door te geven aan wiskundige methoden zoals Math.max() of Math.min().
9. Wat is Function.prototype.bind()?
10. bind() creëert een nieuwe functie die, wanneer hij wordt aangeroepen, zijn eigen functie heeft this trefwoord ingesteld op de opgegeven waarde, met een gegeven reeks argumenten die voorafgaan aan de opgegeven waarde wanneer de nieuwe functie wordt aangeroepen.
11. Hoe kan call() worden gebruikt om methoden te lenen?
12. Je kunt gebruiken call() om methoden van het ene object te lenen en deze op een ander object te gebruiken, waardoor hergebruik van methoden mogelijk is zonder de functie te kopiëren.
13. Is het mogelijk om te gebruiken call() of apply() met constructeurs?
14. Nee, constructors kunnen niet rechtstreeks worden aangeroepen call() of apply(). In plaats daarvan kunt u gebruiken Object.create() voor overervingspatronen.
15. Wat zijn array-achtige objecten, en hoe doen ze dat? call() En apply() met hen samenwerken?
16. Array-achtige objecten zijn objecten met een lengte-eigenschap en geïndexeerde elementen. call() En apply() kan worden gebruikt om deze objecten te manipuleren alsof het arrays zijn.

Samenvatting van het gebruik van bellen en toepassen in JavaScript

In JavaScript, call() En apply() zijn essentieel voor het beheersen van de this context binnen functies. call() maakt het doorgeven van individuele argumenten mogelijk, waardoor het geschikt is voor bekende en vaste argumenten. In tegenstelling tot, apply() neemt een reeks argumenten aan, wat flexibiliteit biedt voor lijsten met variabele argumenten. Beide methoden verbeteren de herbruikbaarheid van code en het aanroepen van dynamische functies, zowel in frontend-ontwikkeling als in Node.js-omgevingen. Begrijpen wanneer en hoe deze methoden effectief kunnen worden gebruikt, is cruciaal voor het schrijven van schone, efficiënte JavaScript-code.