call()und sind zwei häufig verwendete Methoden in JavaScript apply(). Sie werden verwendet, um beim Aufrufen der Funktion den Wert innerhalb der Funktion anzugeben this, und können auch Parameter übergeben. Diese beiden Methoden haben ähnliche Auswirkungen, es gibt jedoch einige Unterschiede. In diesem Artikel werden ihre Funktionen und Unterschiede im Detail vorgestellt und relevante Codebeispiele bereitgestellt.
Anfang
In JavaScript werden call()beide und apply()zum Aufrufen von Funktionen in einem bestimmten Bereich verwendet. Ihre Funktion besteht darin, thisden Zeiger im Funktionskörper zu ändern und Parameter zu übergeben. Als nächstes stellen wir ihre spezifischen Funktionen bzw. Unterschiede vor und veranschaulichen sie anhand von Codebeispielen.
Vor- und Nachteile von call() und apply()
call() und apply() sind beide Methoden zum Aufrufen von Funktionen und haben jeweils einige Vor- und Nachteile.
Vorteile von call():
- Die Parameterliste kann direkt übergeben werden, wodurch der Code prägnanter und intuitiver wird.
- Vorhandene Funktionen können einfacher wiederverwendet werden, indem einfach eine andere Argumentliste übergeben wird.
Nachteile von call():
- Wenn eine große Anzahl von Parametern vorhanden ist, müssen diese einzeln manuell übergeben werden, was zu einer ausführlichen Eingabe führen kann.
- Es eignet sich nicht für die Verwendung, wenn der Parameter ein Array ist und das Array manuell erweitert werden muss.
Vorteile von apply():
- Akzeptiert ein Parameter-Array als Parameter, eignet sich zur Verwendung, wenn der Parameter ein Array ist, und kann Parameter bequemer übergeben.
- Parameter können dynamisch übergeben werden, was für Situationen geeignet ist, in denen die Anzahl der Parameter ungewiss ist.
Nachteile von apply():
- Wenn Sie Parameter übergeben, müssen Sie diese manuell in ein Array kapseln, was möglicherweise nicht intuitiv genug ist.
- Die Verwendung von apply() kann überflüssig sein, wenn das Argument ein einzelner Wert ist.
Im Allgemeinen haben call() und apply() jeweils ihre eigenen anwendbaren Szenarien, und welche Methode verwendet werden soll, hängt von den spezifischen Anforderungen und der Codestruktur ab.
Die Funktion und Verwendung von call()
call()Mithilfe von Methoden können Sie beim Aufrufen einer Funktion ein Objekt thisan mehrere Parameter binden und diese übergeben . Auf diese Weise können Sie beim Aufruf der Funktion den Wert innerhalb der Funktion angeben thisund die entsprechenden Parameter übergeben. Hier ist ein einfaches Beispiel:
function greet(name) {
return "Hello, " + name;
}
console.log(greet.call(null, "Alice"));
Im obigen Beispiel verwenden wir call()die Methode zum nullBinden an thisund übergeben dabei den Parameter „Alice“. Auf diese Weise zeigt greetdie interne Funktion beim Aufruf der Funktion thisdarauf nullund es wird „Hallo, Alice“ ausgegeben.
Die Funktion und Verwendung von apply()
apply()Die Methode ist call()ähnlich, sie kann auch thisden Zeiger im Funktionskörper ändern und Parameter übergeben. Der Unterschied besteht darin, dass apply()die akzeptierten Parameter in Form eines Arrays übergeben werden. Hier ist ein Beispiel:
function sum(a, b) {
return a + b;
}
console.log(sum.apply(null, [3, 5]));
Im obigen Beispiel verwenden wir apply()die Methode zum nullBinden thisund Übergeben der Parameter [3, 5]. Auf diese Weise zeigt sumdie interne Funktion beim Aufruf der Funktion thisdarauf nullund gibt 8 aus.
Codebeispiel
var name = "Evan";
var age = 20;
var person = {
name: "Hillary",
age: 19,
sayIntroduce: function () {
return (
"Hello, My name is " + this.name +" and I'm " +this.age +" years old."
);
},
sayHobby: function (val1, val2) {
return "I'm " + this.name + ", I like " + val1 + " and " + val2 + ".";
}
};
var person1 = {
name: "Coy",
};
console.log(person.sayIntroduce());
// Hello, My name is Hillary and I'm 19 years old.
// 当我们通过 call 和 apply 来this的指向时，不传任何参数，则默认为将this指向修改为 windows
console.log(person.sayIntroduce.call());
// Hello, My name is Evan and I'm 20 years old.
console.log(person.sayIntroduce.apply());
// Hello, My name is Evan and I'm 20 years old.
// 有参数时，this 指向第一个参数：将this指向 person1，由于person1中没有age属性，因此为 undefined
console.log(person.sayIntroduce.call(person1));
// Hello, My name is Coy and I'm undefined years old.
console.log(person.sayIntroduce.apply(person1));
// Hello, My name is Coy and I'm undefined years old.
// 当需要传递参数时，call可以直接写多个参数，apply需要用数组方式传递：
console.log(person.sayHobby.call(person1, 'swimming', 'hiking'));
// I'm Coy, I like swimming and hiking.
console.log(person.sayHobby.apply(person1, ['swimming', 'hiking']));
// I'm Coy, I like swimming and hiking.
Unterschiede und Zusammenfassung
call() und apply() sind beide Methoden zum Aufrufen von Funktionen. Ihre Funktion besteht darin, den Kontext zu ändern, wenn die Funktion ausgeführt wird (d. h. darauf zeigt) und Parameter zu übergeben.
Die Methode call() empfängt den Kontext der Funktion und eine Parameterliste als Parameter, während die Methode apply() den Kontext der Funktion und ein Array von Parametern als Parameter empfängt.
Der Hauptunterschied zwischen call() und apply() besteht in der Art und Weise, wie Parameter übergeben werden. call() muss die Parameter einzeln übergeben, während apply() ein Array von Parametern empfangen kann.
Der Unterschied liegt in der Art und Weise, wie sie Parameter erhalten: call(): Der erste Parameter ist der Wert von this, der sich nicht ändert. Was sich ändert, ist, dass die restlichen Parameter direkt an die Funktion übergeben werden. Bei Verwendung der Methode call() müssen die an die Funktion übergebenen Parameter einzeln aufgelistet werden. apply(): An die Funktion wird das Parameterarray übergeben
Kurz gesagt, call()und apply()sind sehr nützliche Methoden. Sie können thisden Zeiger beim Aufruf der Funktion flexibel angeben und die entsprechenden Parameter übergeben. call()In der tatsächlichen Entwicklung kann die Entscheidung, es entsprechend den spezifischen Anforderungen zu verwenden apply(), uns dabei helfen, klareren und flexibleren Code zu schreiben.