Firefoxとchromeの動作の違いはconstructor.prototypeですか？

Question

多くの時間を実験した結果、__proto__またはObject.getPrototypeOf()メソッドがDOMオブジェクトのプロトタイプチェーンをトラバースする正しい方法だと分かりました。

一連のconstructor.prototypeを使用すると、実際には両方のブラウザでプロトタイプチェーンをトラバースしません（これはECMA標準で定義されている方法ですが、コンストラクタのプロトタイププロパティはプロトタイプオブジェクトです）。

任意の提案やコメントは歓迎されて...

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

私はあなたがコンストラクタ/プロトタイプがどのように機能するかを誤解だと思います。

コンストラクタ関数を指定すると、その.prototypeは、それで構築されたもののプロトタイプになります。プロトタイプの.constructorは、コンストラクター関数を指します。

特に、Element.prototype.constructor === Elementが成り立つはずです。バグのためブラウザに必ずしも必要というわけではありません。このため、Chromeではp2 == p3が表示されます。

Answer 2

私は完全にボリスに同意する... あなたは詳細（https://www.google.com/search?q=javascript+prototype+chain）のために検索する必要がありますが、あなたはDOMオブジェクト内の要素を参照したい場合は基本的に、あなたはこのような以下を実行する必要があります。

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

プロトタイプとは全く違うものですプロト...

あなたは、このようなコンストラクタ関数がある場合：

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

を

次に、（私はあなたが空のidを持つdivの「myInstanceの」と、文書内のid「テスト」と別のものを持っていることを前提とし）のプロトタイプを経て、このコンストラクタにメソッドを追加することができます

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

は、いくつかの追加テスト目的のための方法：

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

その後、あなたは新しい演算子でSomeObjectのをインスタンス化し、このようないくつかのテストを行うことがあります。

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 

これはあなたに少し話しているのか分かりませんが、これがあなたの検索に役立つことを願っています。 よろしくお願いいたします。 Nicolas