Różnica w zachowaniu przeglądarki Firefox i chrome między constructor.prototype?

Question

Po eksperymentach tak długo, zorientowałem się, że metoda __proto__ lub Object.getPrototypeOf() jest prawidłowym sposobem na przechodzenie łańcucha prototypów w obiektach DOM.

Korzystanie z serii constructor.prototype w rzeczywistości nie przechodzi przez łańcuch prototypów w obu przeglądarkach (podczas gdy jest to sposób zdefiniowany w standardzie ECMA, właściwością prototypu jest prototypowa właściwość konstruktora).

Wszelkie sugestie lub komentarz jest mile widziany ...

p1 = document.getElementById("test"); // div element 

//Prototype Object of p1 
p2 = element.constructor.prototype; 

//Prototype object of p2 
p3 = element.constructor.prototype.constructor.prototype; 

console.log(p2 === p3); // true in chrome(howcome they same ?), false in firefox 

q2 = element.__proto__; 
q3 = element.__proto__.__proto__; 

console.log(q2 === q3); // false in both browser 

Answer 1

Chyba źle działa konstruktor/prototyp.

Biorąc pod uwagę funkcję konstruktora, jej .prototyp będzie prototypem rzeczy skonstruowanych razem z nim. Prototype .constructor wskazuje na funkcję konstruktora.

W szczególności powinien być przechowywany Element.prototype.constructor === Element. To niekoniecznie w przeglądarkach z powodu błędów. Dlatego widzisz p2 == p3 w Chrome.

Answer 2

I całkowicie zgadzam się z Borysem ... należy szukać tutaj po więcej szczegółów (https://www.google.com/search?q=javascript+prototype+chain), ale w zasadzie, jeśli chcesz przeglądać elementy obiektu DOM, po prostu trzeba to zrobić jak poniżej:

function exploreElement(element){ 
     contentToString = ""; 
     for (var i in element){ 
      contentToString += i + " : " + element[i] + "<br />"; 
     } 
     document.write(contentToString); 
    } 
    exploreElement(document); 

prototyp i proto są czymś zupełnie innym ...

Jeśli masz funkcję konstruktora takiego:

function SomeObject(){ 
     this.__proto__.id = "instance_default_name"; 
     SomeObject.id = "SomeObject"; 
     // __proto__ HERE to access the prototype!!! 
    } 

Można następnie dodać metody do tego konstruktora poprzez prototyp (zakładam, że masz pusty div o identyfikatorze „myInstance” i kolejna z id „test” w dokumencie):

SomeObject.prototype.log = function(something){ 
     document.getElementById("myInstance").innerHTML += something + "<br />"; 
    } 

Dodaj jakiś metody dla celów testowych:

SomeObject.prototype.setId = function(id){ 
    this.id = id; 
} 
SomeObject.prototype.getId = function(){ 
    return this.id; 
} 
SomeObject.prototype.getClassName = function(){ 
    return SomeObject.id; 
} 

Następnie można utworzyć wystąpienia SomeObject z nowym operatorem i zrobić kilka testów tak:

myInstance = new SomeObject(); 
myInstance.setId("instance_1"); 
aDivElement = document.getElementById("test"); 
aDivElement.style.backgroundColor = "rgb(180,150,120)"; 
myInstance.log("p1 = " + aDivElement); 
// [object HTMLDivElement] 
myInstance.log("p1 backgroundColor = " + (aDivElement.style.backgroundColor)); 
myInstance.log("myInstance = " + myInstance); 
// [object Object] an instance of SomeObject 
myInstance.log("myInstance.constructor = " + myInstance.constructor); 
// function SomeObject() { this.__proto__.id = "instance_default_name"; SomeObject.id = "SomeObject"; } 
myInstance.log("myInstance.constructor.prototype = " + myInstance.constructor.prototype); 
// .prototype WHEN CALLED by the instance NOT __proto__ 
// The constructor of myInstance is SomeObject and the prototype of SomeObject is the prototype of all instances of SomeObject 
myInstance.log("myInstance.id = " + myInstance.getId()); 
// id for the instance of SomeObject that you have instanciated 
myInstance.log("SomeObject.prototype.id = " + SomeObject.prototype.getId()); 
// id by default of the prototype 
myInstance.log("myInstance.constructor.prototype.id = " + myInstance.constructor.prototype.getId()); 
// id by default of the prototype 
myInstance.log("myInstance.getClassName() = " + myInstance.getClassName()); 
// myInstance.getClassName() = SomeObject 

Nie wiem, czy to ci trochę mówi, ale mam nadzieję, że to ci pomoże w poszukiwaniach. Pozdrawiamy. Nicolas