Ein gründliches Verständnis dessen, worauf dieser Zeiger in JavaScript verweist

Zunächst muss gesagt werden, dass der Sinn dieser Funktion nicht bestimmt werden kann. Erst wenn die Funktion ausgeführt wird, kann festgestellt werden, auf wen dies letztendlich verweist nannte es (dies) Es gibt einige Probleme mit diesem Satz, und ich werde später erklären, warum es ein Problem gibt. Obwohl die meisten Artikel im Internet dies sagen, wird es in vielen Fällen tatsächlich keine Probleme geben, es so zu verstehen. Es ist ungenau, es so zu verstehen, daher wird ein Gefühl der Unsicherheit aufkommen, wenn Sie das verstehen. Dann werde ich dieses Thema als nächstes eingehend untersuchen.

Warum sollten Sie das lernen? Wenn Sie funktionale Programmierung oder objektorientierte Programmierung studiert haben, wissen Sie auf jeden Fall, wofür sie verwendet wird. Wenn Sie sie nicht studiert haben, müssen Sie diesen Artikel natürlich auch lesen Wenn Sie interessiert sind, ist dies schließlich etwas, das beherrscht werden muss.

Beispiel 1:

function a(){
    var user = "追梦子";
    console.log(this.user); //undefined
    console.log(this); //Window
}
a();

Nach dem, was wir oben gesagt haben, zeigt dies letztendlich auf das Objekt, das es aufruft. Auf die Funktion a wird hier tatsächlich durch das Window-Objekt hingewiesen Code Es kann bewiesen werden.

function a(){
    var user = "追梦子";
    console.log(this.user); //undefined
    console.log(this);　　//Window
}
window.a();

Es ist derselbe wie der obige Code. Tatsächlich ist die Warnung auch ein Attribut des Fensters und wird auch vom Fenster angeklickt.

Beispiel 2:

var o = {
    user:"追梦子",
    fn:function(){
        console.log(this.user);  //追梦子
    }
}
o.fn();

Dies hier zeigt auf Objekt o, da Sie dieses fn über o.fn() aufrufen, dann ist der natürliche Punkt Objekt o, hier möchte ich es noch einmal betonen dass der Sinn dieser Funktion nicht bestimmt werden kann, wenn sie aufgerufen wird. Stellen Sie sicher, dass Sie dies verstehen.

Tatsächlich sind Beispiel 1 und Beispiel 2 nicht genau genug. Das folgende Beispiel kann die obige Theorie zunichte machen.

Wenn Sie dies vollständig verstehen möchten, müssen Sie die nächsten Beispiele lesen

Beispiel 3:

var o = {
    user:"追梦子",
    fn:function(){
        console.log(this.user); //追梦子
    }
}
window.o.fn();

Dieser Code ist fast derselbe wie der obige Code Das Gleiche, aber warum deutet dies hier nicht auf das Fenster hin? Wenn wir der obigen Theorie folgen, deutet dies letztendlich auf das Objekt hin, das es aufruft. Hier ist ein kleiner Hinweis: Das Fenster ist ein globales Objekt in js, und die Variable, die wir erstellen, ist tatsächlich ein globales Objekt Fügen Sie dem Fenster Attribute hinzu, damit Sie hier den Fensterpunkt oder das Objekt verwenden können.

Lassen Sie uns nicht erklären, warum dies im obigen Code nicht auf das Fenster verweist. Schauen wir uns einen Teil des Codes an.

var o = {
    a:10,
    b:{
        a:12,
        fn:function(){
            console.log(this.a); //12
        }
    }
}
o.b.fn();

Hier wird auch auf das Objekt o hingewiesen, aber das führt es auch nicht aus. Dann werden Sie definitiv sagen, dass das, was ich am Anfang gesagt habe, falsch ist? Eigentlich ist das nicht der Fall, es ist nur so, dass das, was ich am Anfang gesagt habe, ungenau war. Als nächstes werde ich einen Satz hinzufügen, von dem ich glaube, dass Sie das hier aufgezeigte Problem vollständig verstehen können.

Fall 1: Wenn dies in einer Funktion vorhanden ist, es aber nicht vom übergeordneten Objekt aufgerufen wird, dann zeigt dies auf das Fenster. Hier ist zu beachten, dass in der strikten Version von js Folgendes gilt: Dies deutet auf etwas anderes als „window“ hin, aber wir werden hier nicht auf die strenge Version eingehen. Wenn Sie mehr wissen möchten, können Sie online suchen.

Fall 2: Wenn dies in einer Funktion vorhanden ist und diese Funktion vom übergeordneten Objekt aufgerufen wird, dann zeigt dies auf das übergeordnete Objekt.

Fall 3: Wenn dies in einer Funktion vorhanden ist, enthält diese Funktion zwar mehrere Objekte, dies kann jedoch nur auf das Objekt darüber verwiesen werden Glauben Sie es nicht, dann schauen wir uns weiter ein paar Beispiele an.

var o = {
    a:10,
    b:{
        // a:12,
        fn:function(){
            console.log(this.a); //undefined
        }
    }
}
o.b.fn();

Auch wenn es in Objekt b kein Attribut a gibt, zeigt dies auch auf Objekt b, da dieses nur auf sein übergeordnetes Objekt zeigt, unabhängig davon, ob darin etwas enthalten sein soll Objekt.

Es gibt einen weiteren Sonderfall, Beispiel 4:

var o = {
    a:10,
    b:{
        a:12,
        fn:function(){
            console.log(this.a); //undefined
            console.log(this); //window
        }
    }
}
var j = o.b.fn;
j();

Hier zeigt dies auf Fenster Sind Sie verwirrt? Tatsächlich liegt es daran, dass Sie einen Satz nicht verstanden haben, was ebenfalls entscheidend ist.

Dies zeigt immer auf das Objekt, das es zuletzt aufgerufen hat, d. h. wer es aufgerufen hat, als es ausgeführt wurde. In Beispiel 4 wird die Funktion fn zwar vom Objekt b referenziert, wenn fn der Variablen j zugewiesen ist ausgeführt, sodass es letztendlich auf window verweist. Dies unterscheidet sich von Beispiel 3, das fn direkt ausführt.

Dies ist eigentlich dasselbe, weist jedoch in verschiedenen Situationen auf etwas anderes hin. In der obigen Zusammenfassung sind einige kleine Fehler enthalten, die jedoch nicht als Fehler bezeichnet werden können Umstände, also kann ich nicht alles auf einmal erklären, ich kann es nur langsam erleben lassen.

Konstruktorversion davon:

function Fn(){
    this.user = "追梦子";
}
var a = new Fn();
console.log(a.user); //追梦子

　　这里之所以对象a可以点出函数Fn里面的user是因为new关键字可以改变this的指向，将这个this指向对象a，为什么我说a是对象，因为用了new关键字就是创建一个对象实例，理解这句话可以想想我们的例子3，我们这里用变量a创建了一个Fn的实例（相当于复制了一份Fn到对象a里面），此时仅仅只是创建，并没有执行，而调用这个函数Fn的是对象a，那么this指向的自然是对象a，那么为什么对象Fn中会有user，因为你已经复制了一份Fn函数到对象a中，用了new关键字就等同于复制了一份。

　　除了上面的这些以外，我们还可以自行改变this的指向，关于自行改变this的指向请看JavaScript中call,apply,bind方法的总结这篇文章，详细的说明了我们如何手动更改this的指向。

　　更新一个小问题当this碰到return时

function fn()  
{  
    this.user = '追梦子';  
    return {};  
}
var a = new fn;  
console.log(a.user); //undefined

　　再看一个

function fn()  
{  
    this.user = '追梦子';  
    return function(){};
}
var a = new fn;  
console.log(a.user); //undefined

　　再来

function fn()  
{  
    this.user = '追梦子';  
    return 1;
}
var a = new fn;  
console.log(a.user); //追梦子

function fn()  
{  
    this.user = '追梦子';  
    return undefined;
}
var a = new fn;  
console.log(a.user); //追梦子

　　什么意思呢？

　　如果返回值是一个对象，那么this指向的就是那个返回的对象，如果返回值不是一个对象那么this还是指向函数的实例。

function fn()  
{  
    this.user = '追梦子';  
    return undefined;
}
var a = new fn;  
console.log(a); //fn {user: "追梦子"}

　　还有一点就是虽然null也是对象，但是在这里this还是指向那个函数的实例，因为null比较特殊。

function fn()  
{  
    this.user = '追梦子';  
    return null;
}
var a = new fn;  
console.log(a.user); //追梦子

　　知识点补充：

　　1.在严格版中的默认的this不再是window，而是undefined。

　　2.new操作符会改变函数this的指向问题，虽然我们上面讲解过了，但是并没有深入的讨论这个问题，网上也很少说，所以在这里有必要说一下。

function fn(){
    this.num = 1;
}
var a = new fn();
console.log(a.num); //1

　　为什么this会指向a？首先new关键字会创建一个空的对象，然后会自动调用一个函数apply方法，将this指向这个空对象，这样的话函数内部的this就会被这个空的对象替代。

 以上就是JavaScript中this指针指向的彻底理解的内容，更多相关内容请关注PHP中文网（www.php.cn）！