In JS, you can link objects and share properties pretty easily. Let's create an object
talk that has a function
greet. And create 2 objects from where we want to point to the
talk object so that we can invoke the
greet function as if it exists on the
Now, if you log the friend object, you would see the internal slot called
[[Prototype]](in the case of Chrome) and
<prototype>(in the case of Firefox). By default, this internal slot
<prototype> points to the Object constructor, which is one of the fundamental objects. In simple terms, fundamental objects are just built-in objects, they are Object, Function, Boolean, and Symbol functions.
For us to make our object invoke the
greet function as it was its own, we need to make this internal prototype(
[[prototype]] or <prototype>) point to the
talk object. Because this internal prototype is used for lookup when a property/method doesn’t exist on an object.
The following 2 ways we can make the internal prototype point to the
talk object but we DON’T use them because it has performance implications. In a gist, changing the
[[prototype]] is generally slow due to how the JS engine optimizes property accesses.
The correct way to do it would be using the
Object.create creates a temporary object that points to the
talk object, and we make our object point to this temporary object. Look at this simplified polyfill for Object.create or the one at MDN
Notice how the
new keyword does the heavy lifting, take a look at this video to quickly revise and follow what exactly the
new keyword does.
Now, coming back to our code, if you couldn't follow the polyfill for Object.create then simply assume it to be a nice little black box that links objects without having a performance implication. And there are 2 ways to use it:
Object.create has 2 parameters, the second one is a property-descriptor, which is a fancy word for describing the nature of the properties of your object.