Forstå forskellen mellem opkald og anvend i JavaScript

Arthur Petit

Onsdag den 3. juli 2024 kl. 03.22.03

Funktionsankaldelsesmetoder i JavaScript

JavaScript tilbyder flere måder at aktivere funktioner på, hvoraf to er `Function.prototype.call()` og `Function.prototype.apply()`. Begge metoder tjener til at kalde funktioner med en specificeret `denne` værdi og argumenter, men de adskiller sig i, hvordan disse argumenter sendes.

Denne artikel har til formål at udforske forskellene mellem "opkald" og "anvend", deres præstationsimplikationer og scenarier, hvor det ene kan foretrækkes frem for det andet. Til sidst vil du have en klarere forståelse af, hvornår du skal bruge "ring" eller "anvend" i din JavaScript-kode.

Udforskning af forskellene mellem 'ringe' og 'anvend' i JavaScript

JavaScript frontend eksempel

// Example of Function.prototype.call()
const person = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

const person1 = {
  firstName: "John",
  lastName: "Doe"
};

console.log(person.fullName.call(person1)); // John Doe

Forstå effektiviteten af "opkald" vs "anvend" i JavaScript

JavaScript frontend eksempel

// Example of Function.prototype.apply()
const person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + ", " + city + ", " + country;
  }
};

const person2 = {
  firstName: "Jane",
  lastName: "Doe"
};

console.log(person.fullName.apply(person2, ["Oslo", "Norway"])); // Jane Doe, Oslo, Norway

Sammenligning af "opkald" og "søg" om funktionsopkald i JavaScript

Node.js Backend-eksempel

const person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + ", " + city + ", " + country;
  }
};

const person3 = {
  firstName: "Alice",
  lastName: "Smith"
};

function printName(method) {
  if (method === 'call') {
    console.log(person.fullName.call(person3, 'Paris', 'France'));
  } else if (method === 'apply') {
    console.log(person.fullName.apply(person3, ['Paris', 'France']));
  }
}

printName('call');  // Alice Smith, Paris, France
printName('apply'); // Alice Smith, Paris, France

Vælg mellem "ring" og "anvend" i JavaScript-udvikling

JavaScript-ydelsesanalyse

const iterations = 1000000;
const person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + ", " + city + ", " + country;
  }
};
const person4 = {
  firstName: "Bob",
  lastName: "Brown"
};

console.time('call');
for (let i = 0; i < iterations; i++) {
  person.fullName.call(person4, 'Berlin', 'Germany');
}
console.timeEnd('call');

console.time('apply');
for (let i = 0; i < iterations; i++) {
  person.fullName.apply(person4, ['Berlin', 'Germany']);
}
console.timeEnd('apply');

Dybere indsigt i kalde og anvende metoder i JavaScript

Ud over deres grundlæggende brug, og har flere avancerede use cases, der kan forbedre din JavaScript-programmering. En sådan use case er metodelån, hvor metoder fra et objekt er lånt af et andet. Dette er især nyttigt, når du har et objekt, der skal bruge en metode fra et andet objekt uden arv. Ved brug af og apply(), kan du midlertidigt låne metoder og udføre dem i sammenhæng med forskellige objekter, og derved forbedre kodegenanvendelighed og reducere redundans.

Et andet vigtigt aspekt at overveje er brugen af for variadiske funktioner – funktioner, der accepterer et variabelt antal argumenter. Når du har en række argumenter, og du skal overføre dem til en funktion, der ikke accepterer en matrix, bliver yderst praktisk. På den anden side, kan være nyttig i scenarier, hvor ydeevnen er kritisk, og antallet af argumenter er kendt og fast. Ved at forstå disse nuancer kan udviklere træffe mere informerede beslutninger om, hvornår de skal bruges call() imod , der optimerer deres kode til både læsbarhed og ydeevne.

Hvad er den primære forskel mellem og ?
accepterer argumenter individuelt, mens accepterer argumenter som en matrix.
Kan og bruges i flæng?
Ja, de kan opnå det samme resultat, men valget afhænger af, hvordan argumenterne er opbygget.
Hvornår skal jeg foretrække over ?
Brug når du har en række argumenter eller et variabelt antal argumenter.
Er der en præstationsforskel mellem og ?
Ydelsesforskelle er ubetydelige i de fleste tilfælde, men kan være lidt hurtigere med et fast antal argumenter.
Hvordan og håndtere sammenhæng?
Begge metoder indstiller eksplicit kontekst for funktionsindkaldelsen.
Kan jeg bruge og med konstruktørfunktioner?
Nej, de er ikke egnede til konstruktørfunktioner, da de ikke opretter nye forekomster.
Hvad er nogle avancerede use cases til og ?
De er nyttige til metodelån og håndtering af variadiske funktioner.
Hvordan gør forbedre kodelæsbarheden?
gør funktionskaldet tydeligere, når antallet af argumenter er kendt og fast.
Kan håndtere et ukendt antal argumenter?
Ja, er ideel til funktioner, der skal håndtere et variabelt antal argumenter.

Afsluttende tanker om funktionsankaldelsesmetoder

Afslutningsvis begge dele og metoder er kraftfulde værktøjer i JavaScript til at påkalde funktioner med en specificeret værdi. Valget mellem dem afhænger i høj grad af, hvordan du vil videregive argumenter til funktionen. Mens call er bedst, når man har at gøre med et fast antal argumenter, lyser ved håndtering af arrays eller et ukendt antal argumenter. At forstå disse nuancer hjælper med at skrive mere effektiv og læsbar kode, hvilket i sidste ende fører til bedre JavaScript-programmeringspraksis.

Forstå forskellen mellem "opkald" og "anvend" i JavaScript