Ways to Create an Object in Javascript (with Example)

In javascript, Objects are the data types that are used to store data collections as key-value pairs. Objects are non-primitive data types means they are mutable ( can be modified ). 

In javascript, almost everything is an object except primitive data types like string, number, boolean, etc. In Simple words, Objects are containers that contain key-value pairs. The values in an Object can be any property or method.  

For example, In javascript, arrays are objects because they contain properties and methods such as array.length and array.find .

Below is a list of some of the most commonly used ways to create javascript objects.

It is one of the simple ways to create an object in javascript. Object literal syntax is a comma-separated key-value pair set wrapped inside curly braces. Here all you have to do is create your key-value pairs using :, separate them with commas , and then wrap them in curly braces {}.

const person = {
     name: "John", 
     age: 34
};

In this approach, we use a built-in object constructor function Object() to create empty object copies with the help of the new keyword. This approach is generally used in class-based languages like java. Currently, this approach is not recommended.

const person = new Object();

In this approach, we need to manually add the properties.

person.name = "john";
person.age = 34;

Object.create() method used to create a new object using an existing object as a prototype. It takes in two parameters first one is the prototype object and the second is an optional object whose properties will be added to your new object.

Here is the syntax of Object.create() method.

Object.create(prototype, propertiesObject)

The example below uses the Person object as a prototype to create a new object me.

const person = {
    name: "john",
    display(){
        console.log(`My name is ${this.name}`);
        
    }
};

const me = Object.create(person);
me.display(); //My name is john
me.name = "Boris";
me.display(); //My name is Boris

The construction function is the same as the regular function but here you have to make sure that the name of the constructor function should start with a capital letter.

With the help of the constructor function, you can create as many instances of objects as you want.

function Person(name,age){
    this.name = name;
    this.age = age;
};

//creating objects
const newPerson = new Person("john",30);
console.log(newPerson);
//Output: Person { name: 'john', age: 30 }

In the above example,

this : this is used to reference the current object which is in making.
new : it is a keyword used to create new object instances using the Person constructor function.

Classes are the template used to create objects. ECMAScript 2015 or ES6 introduced the javascript classes. To create a class we need to use the class keyword. You also need to define a constructor function inside the class.

Let’s see how to create an object with the help of an example.

class Person {
  constructor(name) {
    this.name = name;
  }
}

const newPerson = new Person("John");

In the above example, we have created a class with the name Person. Inside the class, we have a constructor function that will be executed every time when a new object is created.

So these were the ways that are commonly used to create an object in javascript. I hope you learned some new things today. If you still have any doubt left in your mind then please do ask in the comment section below.