A „call” és az „apply” közötti különbség megértése a JavaScriptben

JavaScript

Funkcióhívási módszerek JavaScriptben

A JavaScript számos módot kínál a függvények meghívására, amelyek közül kettő a "Function.prototype.call()" és a "Function.prototype.apply()". Mindkét módszer meghatározott "this" értékkel és argumentumokkal rendelkező függvények meghívására szolgál, de különböznek az argumentumok átadási módjában.

Ennek a cikknek az a célja, hogy feltárja a „hívás” és az „alkalmaz” kifejezések közötti különbségeket, azok teljesítményre gyakorolt ​​hatásait, valamint azokat a forgatókönyveket, amelyekben az egyiket előnyben részesítik a másikkal szemben. A végére tisztábban fogja tudni, mikor kell használni a "hívás" vagy az "alkalmaz" szót a JavaScript-kódban.

A „call” és az „apply” közötti különbségek felfedezése a JavaScriptben

JavaScript Frontend példa

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

A "hívás" és az "alkalmaz" teljesítményének megértése a JavaScriptben

JavaScript Frontend példa

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

A "call" és az "apply" összehasonlítása a függvényhíváshoz JavaScriptben

Node.js háttérprogram példa

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álasztás a "hívás" és az "alkalmaz" között a JavaScript-fejlesztésben

JavaScript teljesítményelemzés

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');

Mélyebb betekintés a JavaScript-módszerek hívásába és alkalmazásába

Az alapvető használatukon túl és számos speciális használati esettel rendelkezik, amelyek javíthatják JavaScript programozását. Az egyik ilyen használati eset a metóduskölcsönzés, amikor az egyik objektum metódusait egy másik objektum kölcsönzi. Ez különösen akkor hasznos, ha olyan objektummal rendelkezik, amelynek egy másik objektumból származó metódust kell használnia öröklődés nélkül. Használata és apply(), ideiglenesen kölcsönözhet metódusokat és végrehajthatja azokat különböző objektumok kontextusában, ezáltal javítva a kód újrafelhasználhatóságát és csökkentve a redundanciát.

Egy másik fontos szempont a felhasználás variadic függvényekhez – változó számú argumentumot elfogadó függvényekhez. Ha van egy argumentumtömbje, és át kell adnia azokat egy olyan függvénynek, amely nem fogad el tömböt, rendkívül praktikussá válik. Másrészről, hasznos lehet olyan forgatókönyvekben, ahol a teljesítmény kritikus, és az argumentumok száma ismert és rögzített. Ezen árnyalatok megértésével a fejlesztők megalapozottabb döntéseket hozhatnak a használat időpontjáról call() ellen , optimalizálva a kódjukat az olvashatóság és a teljesítmény szempontjából.

  1. Mi az elsődleges különbség a között és ?
  2. érveket egyénileg fogad el, míg tömbként fogadja el az argumentumokat.
  3. Tud és felcserélhetően használható?
  4. Igen, ugyanazt az eredményt érhetik el, de a választás az érvek felépítésétől függ.
  5. Mikor érdemes inkább felett ?
  6. Használat ha argumentumtömbje vagy változó számú argumentuma van.
  7. Van teljesítménybeli különbség a között és ?
  8. A teljesítménybeli különbségek a legtöbb esetben elhanyagolhatóak, de fix számú argumentummal valamivel gyorsabb lehet.
  9. Hogyan és kezelni a kontextus?
  10. Mindkét módszer kifejezetten beállítja a kontextus a függvényhíváshoz.
  11. Használhatom és konstruktor függvényekkel?
  12. Nem, nem alkalmasak konstruktor függvényekre, mivel nem hoznak létre új példányokat.
  13. Mire jó néhány speciális használati eset és ?
  14. Hasznosak a metódusok kölcsönzéséhez és a variadic függvények kezeléséhez.
  15. Hogyan működik javítja a kód olvashatóságát?
  16. világosabbá teszi a függvényhívást, ha az argumentumok száma ismert és rögzített.
  17. Tud ismeretlen számú argumentumot kezelni?
  18. Igen, ideális olyan függvényekhez, amelyeknek változó számú argumentumot kell kezelniük.

Utolsó gondolatok a függvényhívási módszerekről

Befejezésül mindkettő és A metódusok hatékony eszközei a JavaScriptben a megadott függvények meghívására érték. A köztük lévő választás nagymértékben attól függ, hogy hogyan kíván argumentumokat adni a függvénynek. Míg call a legjobb, ha rögzített számú érvvel foglalkozik, tömbök vagy ismeretlen számú argumentum kezelésekor világít. Ezen árnyalatok megértése segít hatékonyabb és olvashatóbb kód írásában, ami végső soron jobb JavaScript programozási gyakorlatokhoz vezet.