Heim > Artikel > Web-Frontend > Detaillierte Erklärung des JS-Prototyps
Dieser Artikel gibt Ihnen hauptsächlich eine detaillierte Erklärung des JS-Prototyps und der 5 Regeln des Prototyps. Ich hoffe, dieser Artikel kann Ihnen helfen.
Alle Referenztypen (Arrays, Objekte, Funktionen) haben Objekteigenschaften, also frei erweiterbare Attribute (außer „null“)
var obj ={};obj.a=100//100var arr=[];arr.a=100//100function fn(){} fn.a=100//100
Alle Anwendungstypen haben ein Proto-Attribut (impliziter Prototyp), und der Attributwert ist ein gewöhnliches Objekt
console.log(obj.__proto__);//{constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}console.log(arr.__proto__);//[constructor: ƒ, concat: ƒ, pop: ƒ, push: ƒ, shift: ƒ, …]console.log(fn.__proto__); //ƒ () { [native code] }
Alle Funktionen haben ein Prototypattribut (expliziten Prototyp), und der Attributwert ist auch ein normales Objekt
console.log(fn.prototype) //{constructor: ƒ}
Das proto Attributwert aller Referenztypen zeigt auf den Prototyp-Attributwert seines Konstruktors (d. h. der implizite Prototyp aller Referenztypen zeigt auf den expliziten Prototyp seines Konstruktors)
console.log(obj.__proto__===Object.prototype); //true//Object是一个构造函数
Wenn Sie versuchen, ein bestimmtes Attribut eines Objekts abzurufen und das Objekt selbst dieses Attribut nicht hat, wird nach seinem Proto (d. h. seinem Konstruktor) gesucht
/*测试*/function Foo(name,age){ this.name = name; } Foo.prototype.alertName = function(){//由于Foo.prototype本身也是一个对象,而对象是可以自由扩展属性的 alert(this.name); }var f = new Foo('zhan'); f.printName = function(){ console.log(this.name); } f.printName();//zhan 可以直接在这个对象中找到这个属性f.alertName();//alert弹出zhan 这时候在这个对象本身找不到这个属性,去Foo.prototype找,得到值/*******************************//*之前在牛可网碰到到一道面试题*/var A = {n:4399};var B = function(){ this.n = 9999; }var C = function(){ var n = 8888; } B.prototype = A; C.prototype = A;var b = new B();var c = new C(); A.n++; console.log(b.n);//9999console.log(c.n);//4400//先从他的实例中找,找不到去它的构造函数的prototype中找
für den obigen Testcode zeigt immer auf das Objekt selbst, sodass beim Ausführen von f.alertName
Zhan
Wenn Sie für den obigen Testcode eine Schleife durchführen, können Sie das Namensattribut, das AlertName-Attribut und das PrintName-Attribut finden. Aber im Allgemeinen hoffe ich nur, das zu erhalten Durch das Objekt selbst definierte Attribute, wie zum Beispiel: Namensattribut und PrintName-Attribut
var itemfor(item in f){ if(f.hasOwnProperty(item)){ console.log(item); // 高级浏览器已经在forin中屏蔽了来自原型的属性 //但在这里建议大家还是加上这个判断,保证程序的健壮性(程序对于规范要求以外的输入情况的处理能力) } }
Verwandte Empfehlungen:
Instanzanalyse js Prototyp und Call()
Vier Schritte der JS-Prototypvererbung
7 empfohlene Artikel über die JS-Prototypkette
Das obige ist der detaillierte Inhalt vonDetaillierte Erklärung des JS-Prototyps. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!