Zrozumienie różnicy między „call” i „apply” w

Arthur Petit

środa, 3 lipca 2024 03:59:46

Metody wywoływania funkcji w JavaScript

JavaScript oferuje kilka sposobów wywoływania funkcji, z których dwa to `Function.prototype.call()` i `Function.prototype.apply()`. Obie metody służą do wywoływania funkcji z określoną wartością „this” i argumentami, różnią się jednak sposobem przekazywania tych argumentów.

Celem tego artykułu jest zbadanie różnic między „zadzwoń” i „zastosuj”, ich wpływu na wydajność oraz scenariuszy, w których jedno może być preferowane nad drugim. Na koniec będziesz lepiej wiedział, kiedy używać „call” lub „apply” w kodzie JavaScript.

Odkrywanie różnic między „call” i „apply” w JavaScript

Przykład frontendu JavaScript

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

Zrozumienie wydajności „call” i „apply” w JavaScript

Przykład frontendu JavaScript

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

Porównanie „call” i „apply” w celu wywołania funkcji w JavaScript

Przykład backendu Node.js

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

Wybieranie pomiędzy „zadzwoń” i „zastosuj” w rozwoju JavaScript

Analiza wydajności JavaScript

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

Głębszy wgląd w wywoływanie i stosowanie metod w JavaScript

Oprócz podstawowego zastosowania, I masz kilka zaawansowanych przypadków użycia, które mogą ulepszyć twoje programowanie JavaScript. Jednym z takich przypadków użycia jest zapożyczanie metod, gdy metody z jednego obiektu są zapożyczane przez inny. Jest to szczególnie przydatne, gdy masz obiekt, który musi użyć metody z innego obiektu bez dziedziczenia. Za pomocą I apply(), możesz tymczasowo wypożyczać metody i wykonywać je w kontekście różnych obiektów, zwiększając w ten sposób możliwość ponownego wykorzystania kodu i zmniejszając redundancję.

Kolejnym ważnym aspektem, który należy wziąć pod uwagę, jest użycie w przypadku funkcji variadic — funkcje akceptujące zmienną liczbę argumentów. Kiedy masz tablicę argumentów i musisz przekazać je do funkcji, która nie akceptuje tablicy, staje się niezwykle przydatny. Z drugiej strony, może być przydatny w scenariuszach, w których wydajność jest krytyczna, a liczba argumentów jest znana i stała. Rozumiejąc te niuanse, programiści mogą podejmować bardziej świadome decyzje dotyczące tego, kiedy używać call() przeciw , optymalizując swój kod zarówno pod kątem czytelności, jak i wydajności.

Jaka jest podstawowa różnica pomiędzy I ?
przyjmuje argumenty indywidualnie, natomiast akceptuje argumenty jako tablicę.
Móc I być używane zamiennie?
Tak, mogą osiągnąć ten sam wynik, ale wybór zależy od struktury argumentów.
Kiedy powinienem preferować nad ?
Używać gdy masz tablicę argumentów lub zmienną liczbę argumentów.
Czy jest różnica w wydajności pomiędzy I ?
Różnice w wydajności są w większości przypadków znikome, ale może być nieco szybsze ze stałą liczbą argumentów.
Jak to zrobić? I zająć się kontekst?
Obie metody jawnie ustawiają kontekst wywołania funkcji.
Mogę uzyć I z funkcjami konstruktora?
Nie, nie nadają się do funkcji konstruktora, ponieważ nie tworzą nowych instancji.
Do czego służą zaawansowane przypadki użycia I ?
Są przydatne do zapożyczania metod i obsługi funkcji wariadycznych.
Jak poprawić czytelność kodu?
sprawia, że wywołanie funkcji jest jaśniejsze, gdy liczba argumentów jest znana i stała.
Móc obsługiwać nieznaną liczbę argumentów?
Tak, jest idealny dla funkcji, które muszą obsługiwać zmienną liczbę argumentów.

Końcowe przemyślenia na temat metod wywoływania funkcji

Podsumowując, jedno i drugie I Metody to potężne narzędzia JavaScript służące do wywoływania funkcji z określonym wartość. Wybór między nimi zależy w dużej mierze od tego, w jaki sposób chcesz przekazać argumenty do funkcji. Chwila call jest najlepszy, gdy mamy do czynienia ze stałą liczbą argumentów, świeci podczas obsługi tablic lub nieznanej liczby argumentów. Zrozumienie tych niuansów pomaga w pisaniu bardziej wydajnego i czytelnego kodu, co ostatecznie prowadzi do lepszych praktyk programowania JavaScript.

Zrozumienie różnicy między „call” i „apply” w JavaScript