Explained below are some of the different ways of creating Objects in JavaScript.

• Objects created with syntax constructs (Object Literal Notation)

var o = {a: 1};

• With Function (New Objects with Constructor function)

A constructor is a function that contains instructions about the properties of an object when that object is created and assigned. Advantage over object literal is you can create many instances of objects that have the same properties.

function Car() {
    this.make = 'Honda';
    this.model = 'Civic';
}

var c = new Car();

• With Object.create

ECMAScript 5 introduced a new method Object.create.

var a = {a: 1};

var b = Object.create(a);

console.log(b.a); // 1 (inherited)

• With Class

JavaScript classes were introduced in ECAMScript 2015 (ES6)

Class Car {
    constructor(make, model) {
        this.make = make;
        this.model = model;
    }
}

var c = new Car();

Reference

• Inheritance and the prototype chain
• Classes

Each JavaScript object has a private property which holds a link to another object called its prototype. That prototype object has a prototype of its own, and so on until a object is reached with null as its prototype. null has no prototype and acts as the final link in this prototype chain.

Multiple inheritance with prototypes is referred to as a prototype chain.

function Car() {
    this.make = "Honda";
    this.model = "Civic";
}

let c = new Car();
Car.prototype.fuel = "Gas";

console.log(c.make); 
// Is there an 'make' own property on c? Yes, and its value is "Honda"
console.log(c.model); 
// Is there a 'model' own property on c? Yes, and its value is "Civic"
console.log(c.fuel); 
// Is there a 'fuel' own property on c? No, check its prototype. Is there a 'fuel' property on c.[[Prototype]]? Yes, and its value is "Gas"
// The notation someObject.[[Prototype]] is used to represent the prototype of someObject

To check whether an object has a property defined on itself and not somewhere on its prototype chain, it is necessary to use the hasOwnProperty method which all objects inherit from Object.prototype.

c.hasOwnProperty("make"); //true
c.hasOwnProperty("fuel"); //false

All functions have a special property named prototype.

function foo() {
    return 'foo';
}
// Function foo inherits from Function.prototype

References:

• Inheritance and the prototype chain
• Prototypal inheritance

A constructor in JavaScript is a function that is called with the “new” operator.

Difference is scope is function based and context is object based.

Scope

Variables can have either local or global scope. Local variables exist only within the function in which they are defined. Variable declared outside the function can be accessed and modified by another function also.

var planet = "sun"; // global variable

console.log(planet); //sun

function solar_system() {
    var star = "sun"; // local variable
}
console.log(star); // Error, star is not defined

Context

Context this is set to the object the function is called on.

var myObj = {
    id: 10,
    myFunc: function() {
        console.log(this.id); // this refers to `myObj`
    }
};

myObj.myFunc(); // 10

function foo() {
    console.log(this); // `this` refers to the `window` object
}

foo();  

Reference

• JavaScript Scope and Closures
• Understanding Scope and Context in JavaScript

In JavaScript classes can be created using functions. Let’s see how.

function Car() {
    this.make = 'Honda';
    this.model = 'Civic';
    this.color = 'gray';

    this.getInfo = function() {
        return this.make + ' ' + this.model + ' ' + this.color;
    };
}

var mycar = new Car();

The method getInfo() gets recreated every time we create a new object. Instead we can add getInfo() to the prototype.

Car.prototype.getInfo = function() {
    return this.make + ' ' + this.model + ' ' + this.color;
}