The difference between Firefox and chrome between the constructor. Prototype?

Question

After spending a lot of time experimenting, I realized that the __proto__ or Object.getPrototypeOf() method is the right way to go through the prototype chain in DOM objects.

Using a series of constructors. Prototype does not actually cross the prototype chain in both browsers. (while this is defined by the ECMA standard, the prototype property of the constructor is your object prototype).

Any suggestion or comment is welcome ...

 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

I completely agree with Boris ... You should look for more information here ( https://www.google.com/search?q=javascript+prototype+chain ), but basically, if you want to view the elements in the DOM object, you just need to do this as described below:

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

Prototype and proto are something completely different ...

If you have a design function like this:

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

Then you can add methods to this constructor using a prototype (I assume that you have an empty div with the identifier "myInstance" and another with the identifier "test" in the document):

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

Add some methods to test:

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

Then you can create an instance of SomeObject with a new statement and run several such tests:

 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 

I don’t know if this will talk a little with you, but I hope this helps you in your search. Best wishes. Nicolas

Answer 2

I think you misunderstood how the constructor / prototype works.

Given the design function, its .prototype will be the prototype of things built with it. The prototype .constructor points to a constructor function.

So, in particular, Element.prototype.constructor === Element must be executed. This is not necessary in browsers due to errors. This is why you see p2 == p3 in Chrome.