In the last part, we looked at the this keyword in Javascript and saw how it is determined just before function execution. We spent some time in a couple of gotchas due to this "late" binding and mitigation strategies against them. At the beginning of the last part, we saw different ways of creating objects in Javascript and noted a preference for using the new operator when creating them.
To recap, in Javascript, an object is nothing but a collection of properties, properties can be private/privileged/public and they can be data types or functions. var vs this determines the difference between something that is private vs something that can be accessible externally.
The new operator is used before a function to create an object. The function appearing after new is the constructor function that constructs the object.
The new keyword, though an operator by nature, can be thought about as a function that executes a few statements using the constructor function as an argument. The steps taken by this new function are as follows,
It first creates an object based on the prototype of the constructor function. We will cover the prototype property later, but for now you can think of it as creating an empty object of type Object.
var newObject = object.create(Car.prototype);
Now that we have the newObject, the next step is to invoke the constructor on the newObject. To paraphrase, we have to invoke the constructor function after assigning the this reference to the newly created object. The javascript Function object has 2 methods that can be used to invoke a function on a certain object as context. These functions are call and apply. The difference between call and apply are in the way they take arguments when invoking the function. The first argument is always the context object or the object to which the this reference has to be pointing. The call takes the arguments more naturally, as if you were calling the function with an additional argument in the first position. apply is slightly different, the second parameter in the apply function is a Javascript array that takes the arguments.
//Using the Function.call method.
var result = Car.call(newObject, numberOfCylinders, carType);
//If the Function.apply method was used the call would've looked like,
// var result = Car.apply(newObject, [numberOfCylinders, carType]);
The last step of the new function is to actually return the constructed object. The result var or the newObject var can be returned in the above code. However, it may not be right to return the result var or the newObject var as is. It could so have happened that the constructor function creates another object of its own and returns it, perhaps using the simpler method of object creation. Then returning the newObject var will be empty and wrong. Conversly, if a constructor function does not return anything and only assigns the properties of the object to this, it will be wrong to return the result var as it will be null. The new function takes this into consideration and makes an additional check, returning either the result var or the newObject var depending on what the constructor function returns.
var returnObject = result && typeof result === 'object' ? result : newObject;
In summary, the new operator takes care of object creation and proper construction. In addition to memory allocation for the object, it sees that the right this reference is given for object construction and takes care of constructor function quirks.
The next part will be examining an object's prototype property and how it helps in inheritance.