Objects in JavaScript

In JavaScript, There are two kind of Objects.

  • Object
  • Object is a built-in the JavaScript object which from which every other object ( built-in and user-defined) are inherited.
    Object provides many methods which are useful. In this chapter, Methods provided by Object in JavaScript are detailed.

  • User Defined Objects

The user-defined object is a collection of related data. Data is usually variables and/or functions.

  • Object Properties:

    Variable stored in the object is called the property of the object which will have a value.

  • Object Methods:

    Functions stored in the object is called a method of the object.

Let us have a look at an example.


let vehicle = {};
vehicle.color = "red";
vehicle.getBrand = function(){
    return "BMW";
};
                    

In above example, vehicle is an user defined object. We added color property to it and its value is red.
We also added object method getBrand which is a function.

Create Object

There are predefined objects in JavaScript. But you also can create your own object.
There are many ways to create the user-defined object in JavaScript. Let us see them one by one.

Object Initializer (Literal Notation)

Object initializer is sometimes called literal notation.


var emptyObject = {};

let vehicle = {
    property1: value1, // property name can be identifier
    "property2": value2, // property name can be string
    3: value3, // property name can be number
    "$": value4, // it can be any special character in string
    " ": value5 // it can be empty string
};

let grandParent = {
    parent: {
        child: 2
    },
    sibling: 3
}
                    

In above code, emptyObject is created with '{}'. It doesn't contain any data.
vehicle is a object which has many properties. Property can be an identifier, string, number or an empty string.
Object can have a property which is an object. grandParent object is like that.

Using a constructor function

To create an object using a constructor function,

  • Define a function

    It is a good habit to have a constructor function name with a capital initial letter.

  • Create an instance of that function using new keyword.


function Vehicle(name, type, ownerName){
    this.name = name;
    this.type = type;
    this.ownerName = ownerName;
}

var bike = new Vehicle("Yamaha", "bike", "John");
console.log(bike);
//output: {
//          name: "Yamaha",
//          type: "bike",
//          ownerName: "John"
//        }
var car = new Vehicle("BMW", "car", "Doe");
//output: {
//          name: "BMW",
//          type: "car",
//          ownerName: "Doe"
//        }

                    

In above code, we have created a constructor function Vehicle. In that function, you will add those properties name which you need an object. Notice that we have used this keyword. All the properties that you want in an object needs to declared by this keyword.
this keyword refers to the function's context. When ever you add variable into this keyword, it can be accessed by the object created using that function.
var bike = new Vehicle("Yamaha", "bike", "John"); creates bike object. To do that, new keyword is used and all the needed value is passed to be saved into properties.

Object.create method

Object.create method creates the object based on the object prototype. Syntax of the method is Object.create(prototype_object, propertiesOfObject).
Let us have a look at an example.


let emptyObject = Object.create(null);

let vehiclePrototype = {
    name: "BMW",
    type: "Car",
    ownerName: "John"
};

let car = Object.create(vehiclePrototype);
console.log(car);
//output: {
//          name: "BMW",
//          type: "Car",
//          ownerName: "John"
//        }

                    

Conclusion

In this section, you have learned about the basics of Object, its definition and how to create it.
In next section, you will learn about access data of object in JavaScript.