In diesem Artikel wird hauptsächlich das neue Verständnis des This-Zeigers in JavaScript vorgestellt. In diesem Artikel werden der Methodenaufrufmodus, der Funktionsaufrufmodus, der Konstruktor-Aufrufmodus und der Apply-Aufrufmodus erläutert. Um diesen Hinweis zu verstehen, können sich Freunde, die ihn benötigen, auf
beziehen. Das Verständnis davon war immer, dass es verwendet werden kann und verwendet werden kann, aber es hat sich nicht mit seinem Wesen befasst. Dieses Mal habe ich durch „JavaScript The Good Parts“ ein tiefes Verständnis gewonnen. (Alle Debugging-Vorgänge können in der Konsole über die F12-Taste des Browsers angezeigt werden.)
Schauen wir uns das gemeinsam an.
Wenn wir eine Funktion deklarieren, verfügt jede Funktion selbst zusätzlich zu den Parametern (formalen Parametern) bei ihrer Definition über zwei zusätzliche Parameter, einer ist dieser und der andere sind Argumente (tatsächliche Parameter). Argumente sind die tatsächlich von der Funktion empfangenen Parameter, bei denen es sich um ein Array-ähnliches Array handelt. Ich werde nur eine kurze Einführung in die Argumente geben und mich dabei auf diesen Hinweis konzentrieren.
Bei der objektorientierten Programmierung ist dies sehr wichtig und sein Wert hängt vom Aufrufmodus ab. In JavaScript gibt es insgesamt 4 Aufrufmodi: Methodenaufrufmodus, Funktionsaufrufmodus, Konstruktoraufrufmodus und Anwendungsaufrufmodus.
Methodenaufrufmuster
Wenn eine Funktion als Eigenschaft eines Objekts verwendet wird, nennen wir die Funktion normalerweise eine Methode des Objekts. Wenn diese Methode aufgerufen wird, zeigt sie auf das Objekt, zu dem die Methode gehört.
Der Code lautet wie folgt:
<script type="text/javascript">
var people = {
name : "Yika",
sayName : function(){
console.log(this.name); //"Yika"
//this已经绑定在了people对象上了
}
}
people.sayName();
</script>Nach dem Login kopieren
Wie in der Kastanie gezeigt, verweist dies auf das sayName-Objekt. Diese Methode zum Abrufen des Kontexts des Objekts ist eine öffentliche Methode. (öffentliche Methode)
Funktionsaufrufmodus
Wenn eine Funktion aufgerufen wird und keine Methode für ein Objekt ist, wird sie als Funktion aufgerufen. Wenn
in diesem Modus aufgerufen wird, zeigt dies auf das Fensterobjekt, auch wenn diese Funktion möglicherweise in einer externen Funktion aufgerufen wird. Schauen wir uns ein Beispiel an.
Der Code lautet wie folgt:
<script type="text/javascript">
var name = "window-Yika";
var people = {
name : "people-Yika",
student : function(){
console.log(this); //这里的this绑定的是对象people
function sayName(){
var name = "sayName-Yika";
console.log(this.name); //window-Yika
//即使sayName函数本身和它所在的people对象都有name值，但是this是指向window的
};
sayName();
}
}
people.student();
</script>Nach dem Login kopieren
So gesehen wissen Sie wahrscheinlich, wie Sie diesen „Designfehler“ in JavaScript beheben können.
Ja, speichern Sie dies einfach in der Student-Funktion (Zeile 6). Übertragen Sie dies dann über eine Variable an die Funktion sayName und Sie können es lösen!
Der Code lautet wie folgt:
var people = {
name : "people-Yika",
student : function(){
var self = this; //将this缓存起来
function sayName(){
var name = "sayName-Yika";
console.log(self.name); //"people-Yika"，此时的self指向的是people对象
};
sayName();
}
}Nach dem Login kopieren
Konstruktor-Aufrufmodus
Wenn Sie über Konstruktoren in JavaScript sprechen, denken Sie an Folgendes: „ Funktion Schreiben Sie den Namen groß! Verwenden Sie beim Aufruf den neuenOperator! Aber haben Sie sich schon einmal damit beschäftigt, warum Sie „new“ verwenden müssen? Wenn Sie eine Funktion mit new davor aufrufen, erstellt der Funktionshintergrund ein neues Objekt, das auf den Prototyp der Funktion zeigt, und dieser wird auch an das neue Objekt gebunden. JavaScript ist eine Sprache, die auf der Prototypenvererbung basiert. Schüler, die sich mit Prototypen nicht so gut auskennen, können die Informationen selbst überprüfen.
Werfen wir zunächst einen Blick darauf, wie ein Konstruktor im Allgemeinen aussieht.
Der Code lautet wie folgt:
<script type="text/javascript">
function People(name){
this.name = name; //这里的this，用new调用后便指向了新对象Yika
this.sayName = function(){
console.log(this.name); //输出
}
}
var Yika = new People("Yika");
Yika.sayName(); //输出“Yika" ，因为Yika是通过new调用得来的，this都绑定在了Yika对象上。
</script>Nach dem Login kopieren
Auf den ersten Blick scheint es nicht leicht zu verstehen, warum dies in der Funktion gerade angezeigt wurde Das Fenster muss jetzt nicht zwischengespeichert werden. Kann es auf die Personenfunktion verweisen?
Es spielt keine Rolle, dass eine Funktion, wenn sie über new aufgerufen wird, hinter den Kulissen „schlechte Dinge“ tut.
Der Code lautet wie folgt:
<script type="text/javascript">
function People(name){
var that = {}; //坏事一：自己生成一个对象
that.name = name;
that.sayName = function(){
console.log(that.name);
};
return that; //坏事二，自己会改变return的行为，return刚生成的对象
}
var Yika = People("Yika"); //这里可以省略new，模仿调用new操作符
Yika.sayName(); //和刚才一样输出"Yika"
</script>Nach dem Login kopieren
Wenn Sie es so betrachten, wird es klar, dass New nicht nur ein Objekt generiert, sondern auch. aber auch automatisch das Objekt zurückgeben. Dies zeigt natürlich auf dieses neue Objekt.
Stellen Sie sicher, dass Sie zum Aufrufen des Konstruktors new verwenden, da sonst keine Warnung erfolgt, wenn etwas schief geht. Alle Groß- und Kleinschreibungskonventionen sind weiterhin unbedingt erforderlich.
Aufrufmodus anwenden
Die Apply-Methode ermöglicht es uns, ein Array von Parametern zu erstellen, die an die aufrufende Funktion übergeben werden, und ermöglicht uns auch, diesen Wert zu ändern.
function.apply(dieser gebundene Wert, Argumente-Parameter-Array)
Es gibt zu viele Dinge, die über „Anwenden“ gesagt werden können. Ich gebe Ihnen nur ein Beispiel, um Ihnen das Verständnis zu erleichtern:
Der Code lautet wie folgt:
<script type="text/javascript">
function People(name){
this.name = name;
this.sayName = function(){
console.log(this.name); //sayName这个方法是属于People构造函数的
}
}
function Student(name){
People.apply(this, arguments);//借用构造函数的集成方式，就是在Student构造函数里，通过apply调用People构造函数，并改变People的this值
//这样每次创建Student实例时，都会调用People构造函数
}
var student = new Student("Yika");
student.sayName(); //输出“Yika”
</script>Nach dem Login kopieren
Wir können dieses Bindungsobjekt der Funktion einfach über apply ändern. Der Methodenaufruf ähnelt apply und hat auch das gleiche Interessierte Studierende können es selbst durchsuchen.
Okay, wir sind endlich damit fertig, über die vier Aufrufmodi zu sprechen, um dies zu ändern. Der Methodenaufrufmodus und der Konstruktoraufrufmodus werden häufiger verwendet und sind wichtiger Lernen Sie es. Vermeiden Sie die Fallstricke.
Wenn es Fehler gibt, melden Sie diese bitte rechtzeitig und ich werde sie so schnell wie möglich korrigieren, um eine Irreführung anderer zu verhindern. Vielen Dank!
Das obige ist der detaillierte Inhalt vonNeues Verständnis dieses Zeigers in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
