Heim >Web-Frontend >js-Tutorial >Der Hinweis darauf in JS und die Funktionen von call und apply_Grundkenntnisse
Dieser Artikel teilt Ihnen den grundlegenden Inhalt von JS mit, dieser Zeiger und die damit verbundenen Wissenspunkte zum Aufrufen und Anwenden. Freunde, die interessiert sind, können ihn lernen und darauf verweisen.
In bestimmten praktischen Anwendungen kann der Sinn dieser Funktion nicht bei der Definition bestimmt werden, sondern bei der Ausführung der Funktion. Je nach Ausführungsumgebung kann sie grob in die folgenden drei Typen unterteilt werden:
1. Wenn die Funktion als normale Funktion aufgerufen wird, zeigt dies auf das globale Objekt
2. Wenn die Funktion als Methode des Objekts aufgerufen wird, zeigt dies auf das Objekt
3. Wenn die Funktion als Konstruktor verwendet wird, zeigt dies auf das neu erstellte Objekt
Beispiel eins:
window.name = 'myname'; function getName() { console.log(this.name); } getName(); //输出myname
Beispiel zwei:
var boy = { name: 'Bob', getName: function() { console.log(this.name); } } boy.getName(); //输出Bob
Beispiel 3:
function Boy(name) { this.name = name; } var boy1 = new Boy('Bob'); console.log(boy1.name); //输出Bob
Bei Beispiel 3 gibt es einen weiteren Sonderfall, nämlich wenn der Konstruktor gibt ein Objekt über „return“ zurück, die Operation dieser Operation. Das Endergebnis ist dieses Objekt, kein neu erstelltes Objekt, daher ist dies in diesem Fall nutzlos.
Beispiel 4:
function Boy(name) { this.name = name; return { //返回一个对象 name: 'Jack' } } var boy1 = new Boy('Bob'); console.log(boy1.name); //输出Jack
Beispiel 5:
function Boy(name) { this.name = name; return 1; //返回非对象 } var boy1 = new Boy('Bob'); console.log(boy1.name); //输出Bob
Die Rolle von Anrufen und Bewerben
apply akzeptiert zwei Parameter. Der erste Parameter gibt den Zeiger davon im Funktionskörper an. Der zweite Parameter ist ein Array oder Array-ähnliches, das zur Übergabe der aufgerufenen -Funktion verwendet wird. Liste der Parameter .
Beispiel 1:
function getInfo() { console.log(this.name+' like '+arguments[0]+' and '+arguments[1]); } var boy1 = { name: 'Bob', age: 12 } getInfo.apply(boy1,['sing','swimming']); //输出Bob like sing and swimming
call Die Anzahl der übergebenen Parameter ist nicht festgelegt. Wie bei apply wird auch der erste Parameter verwendet, um dies in der Funktion anzugeben Beginnend mit dem zweiten Parameter wird jeder Parameter nacheinander an die aufgerufene Funktion übergeben.
Beispiel 2:
function getInfo() { console.log(this.name+' like '+arguments[0]+' and '+arguments[1]); } var boy1 = { name: 'Bob', age: 12 } getInfo.call(boy1,'sing','shopping'); //输出Bob like sing and shopping
Darüber hinaus implementieren die meisten fortgeschrittenen Browser auch die Bind-Methode. Der Unterschied zwischen it und call and apply besteht darin, dass bind dies nur innerhalb von ändert Funktion zeigt darauf, wird aber nicht sofort ausgeführt, Sie müssen sie explizit aufrufen.
Beispiel 3: Simulieren Sie die Bindungsmethode des Browsers
Function.prototype.bind = function(obj){ var self = this; return function(){ return self.apply(obj,arguments); } }; var obj = { name: 'Bob', age: 12 }; var func = function(){ console.log(this.name+' like '+arguments[0]+' and '+arguments[1]); }.bind(obj); func('sing','shopping');
Das Fehlende dieses
ist drin In einigen Fällen geht die Ausrichtung hiervon verloren. Zu diesem Zeitpunkt müssen wir call, apply und bind verwenden, um die Ausrichtung hiervon zu ändern.
Beispiel 1: Wenn die Methode „getName“ als Eigenschaft des „boy“-Objekts aufgerufen wird, zeigt diese auf das „boy“-Objekt und wenn eine andere Variablereferenziert "getName" "-Methode, da sie als gewöhnliche Funktion aufgerufen wird, zeigt sie auf das globale Objektfenster
var boy = { name: 'Bob', getName: function() { console.log(this.name); } } boy.getName(); //输出Bob var getBoyName = boy.getName; getBoyName(); //输出undefined
Beispiel 2: Auch wenn die Funktion innerhalb der Funktion definiert ist, wenn sie als aufgerufen wird Ein gewöhnliches Objekt, das auch auf das Fensterobjekt verweist
var boy1 = { name: 'Bob', age: 12, getInfo: function() { console.log(this.name); function getAge() { console.log(this.age); } getAge(); } } boy1.getInfo(); //Bob //undefined
Ich glaube, Sie haben die Methode beherrscht, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website !
Empfohlene Lektüre:
So zeigen Sie persönliche Informationen an und ändern das Passwort in Vue
Analyse des Vue-Datenreaktionsprinzips
Das obige ist der detaillierte Inhalt vonDer Hinweis darauf in JS und die Funktionen von call und apply_Grundkenntnisse. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!