Understanding the difference between Object.create() and the new operator.

Why is it important to know the difference?

1. You will run across code that is not the absolute most recent Javascript.
2. To be a great developer you need to learn how to deal with all types of code. That includes old code!
3. Underneath the hood, the class keyword introduced in ECMAScript 6 utilizes the new operator behind the scenes.

Let’s start by examining what Object.create does:

var dog = {
    eat: function() {
        console.log(this.eatFood)
    }
};

var maddie = Object.create(dog);
console.log(dog.isPrototypeOf(maddie)); //true
maddie.eatFood = 'NomNomNom'; 
maddie.eat(); //NomNomNom

Let’s go step by step through the above example and see what exactly is happening.

1. Create an object literal named dog which has a single method called eat.
2. Initialize maddie using Object.create(dog), which creates a completely new object with its prototype set to dog.
3. Test to see if dog is a prototype of maddie.
4. Set the string to be output via this.eatFood
5. Call the eat function with the newly created object, maddie.
6. Javascript will go through the prototype chain and find the eat method on dog with the “this” keyword set to maddie.
7. Outputs NomNomNom in console.