Welcome to the first installment in an infinite series on JavaScript I like to call “Hitting Bottom”. JavaScript is an amazing language. Amazingly brutal and amazingly misunderstood. If you’re feeling “pretty confident” with your grasp on the JavaScript language then this series will destroy that confidence.
I was feeling pretty confident, I remembered feeling pretty confident about JavaScript a couple years ago too and having that confidence dashed upon learning more. Now that confidence is dashed again, but I’m building it up… slowly. And maybe I can bring you along with me this time, to spare you from waking up under an overpass on the information super highway, covered in CSS classes and your own vomit, pulling angle brackets out of your hair and scrounging around in your pocket for enough $() to purchase one more bottle of #B0053.
So, onwards.
Constructors, what are they? They are the functions that construct objects. Check it:
equals({}.constructor, Object, "{}.constructor"); equals([].constructor, Array, "[].constructor"); equals(''.constructor, String, "''.constructor"); equals(true.constructor, Boolean, "true.constructor"); equals(false.constructor, Boolean, "false.constructor"); equals((function(){}).constructor, Function, "anonymous function constructor");
Pretty cool. And if we were to make our own constructor JavaScript would be totally chill with that.
function A() { } var a = new A(); equals(a.constructor, A, "a.constructor");
That’s the wonderful thing about JavaScript, if you are doing regular things then everything works as expected.
function B() { } var b = new B(); equals(b.constructor, B, "b.constructor"); B.prototype = new A(); var b2 = new B(); equals(b.constructor, B, "Constructor for existing object does not change after changing prototypes"); equals(b2.constructor, A, "Constructor for new objects changes after changing prototypes");
So constructors are defined when the object is created, based on the prototype property inheritance chain. They don’t change for previously created objects when the prototype property changes, but newly created objects will have the new value for the constructor.
function C() {} B.prototype = new C(); var b3 = new B(); equals(b3.constructor, C, "Constructor for new objects changes after changing prototypes again.");
It just keeps going deeper if you have more prototypes. Maybe there was like half a trick in there. Somehow I don’t think we’ve hit bottom yet.