JavaScript-Funktion apply() und bind() Methoden

Shiv Yadav 12 Oktober 2023
  1. JavaScript-Methode Function.apply()
  2. JavaScript-Methode Function.bind()
JavaScript-Funktion apply() und bind() Methoden

In diesem Tutorial erfahren Sie, wie Sie die Methoden apply() und bind() des JavaScript-Funktionstyps verwenden.

JavaScript-Methode Function.apply()

Sie können eine Funktion mithilfe eines Arrays von angegebenen Parametern und einem bestimmten this-Wert mithilfe der Methode Function.prototype.apply() aufrufen. Die Syntax für die Funktion apply() lautet wie folgt:

Function.apply(thisArg, [args]);

An die Funktion apply() können zwei Parameter gesendet werden. Der Parameter thisArg ist der Wert von this, der für den Funktionsaufruf bereitgestellt wird, und das Argument args ist ein Array, das die Argumente der Funktion definiert.

Der Parameter args kann seit ES5 entweder ein Array-Objekt oder ein Array-ähnliches Objekt sein.

Ähnlich wie die Methode call() akzeptiert die Methode apply() die Parameter der Funktion als Array und nicht als einzelne Argumente.

Sehen wir uns einige Beispiele mit der Methode apply() an. Angenommen, Sie haben ein indivi-Objekt und eine Begrüssungsfunktion mit dem Namen gt wie folgt:

const indivi = {
  fName: 'Shiv',
  lName: 'Yadav',
};
function gt(wave, sms) {
  return `${wave} ${this.fName}. ${sms}`;
}
let output = gt.apply(indivi, ['Hello', 'Where are you going?']);
console.log(output);

Code ausführen

wave und sms sind die beiden Argumente, die die gt()-Methode akzeptiert. Wir verweisen auf ein Objekt mit dem fName-Feld innerhalb der gt()-Funktion.

Die apply()-Methode kann verwendet werden, um die gt()-Funktion aufzurufen, wobei this auf ein einzelnes Objekt gesetzt ist, indem das folgende Beispiel verwendet wird:

Ausgang:

"Hello Shiv. Where are you going?"

Das obige Beispiel setzt das indivi-Objekt als this-Wert innerhalb der Funktion. Die Methode apply() hat die Parameter der Funktion gt() als Array erhalten.

Die Funktion gt() wurde von der Methode apply() aufgerufen, mit den Parametern als Array ["Hello," "Where are you going?"] und dieser Wert wird auf das Objekt indivi gesetzt .

JavaScript-Methode Function.bind()

Das Schlüsselwort this der neuen Funktion, die von der Methode bind() erstellt wird, wird beim Aufruf auf den angegebenen Wert gesetzt. Obwohl es wirklich viel mehr Themen behandelt, werden wir es für ein anderes Mal aufheben.

Das hat viel Kraft. Durch den Aufruf einer Funktion können wir den Wert von this explizit deklarieren.

Untersuchen wir den Code:

var indivi = {
  fName: 'Shiv',
  lName: 'Yadav ',
  getIndiviName: function() {
    var fName = this.fName + ' ' + this.lName;
    return fName;
  },
};

var indiviName = function() {
  console.log(this.getIndiviName() + 'Where are you Going ?');
};

var logName = indiviName.bind(indivi);

logName();

Code ausführen

Lass es uns sezieren. Die JS-Engine erstellt eine neue Instanz von indiviName und bindet indivi als diese Variable, wenn wir die Funktion bind() verwenden. Es ist wichtig zu erkennen, dass es die indiviName-Funktion dupliziert.

Obwohl logName() ursprünglich nicht auf dem indivi-Objekt war, kann es jetzt aufgerufen werden, nachdem die indiviName-Funktion dupliziert wurde. Es wird nun in der Lage sein, seine Attribute (Shiv und Yadav) und seine Praktiken zu identifizieren.

Der wesentliche Teil ist, dass wir, nachdem ein Wert gebunden wurde, die Funktion genauso verwenden können wie jede andere reguläre Funktion.

Ausgang:

"Shiv Yadav Where are you Going ?"
Autor: Shiv Yadav
Shiv Yadav avatar Shiv Yadav avatar

Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.

LinkedIn

Verwandter Artikel - JavaScript Function