Different ways to create an object in JavaScript?

Sonu Kumar
2 min readFeb 21, 2024

--

console output

What are the different ways to create an object in javascript?

JavaScript Object Creation: A Comprehensive Guide to Different Methods

Creating Objects in JavaScript: Various Approaches

There are multiple ways to create objects in JavaScript, each serving different purposes:

  1. Object Constructor: The most straightforward method is using the Object constructor. However, it’s currently not recommended.
var object = new Object();
console.log(object);

try it on: https://jsbin.com/juxifixezu/edit?js,console,output

2. Object’s Create Method: The create method of Object generates a new object by specifying the prototype object as a parameter.

var object = Object.create(null);
console.log(object);

you can run and test it on jsbin

3. Object Literal Syntax: The object literal syntax, or object initializer, involves a comma-separated set of name-value pairs enclosed in curly braces.

var object = {
name: "Sonu",
age: 34
};
console.log(object);

you can run and test it on jsbin

4. Function Constructor: Creating a function and applying the new operator generates object instances.

function Person(name) {
this.name = name;
this.age = 21;
}
var object = new Person("Sonu");
console.log(object);

you can run and test it on jsbin

5. Function Constructor with Prototype: Similar to a function constructor, this method uses prototypes for properties and methods.

function Person() {}
Person.prototype.name = "Sonu";
var object = new Person();

console.log(object);

This is equivalent to an instance created with an object creating a method with a function prototype and then calling that function with an instance and parameters as arguments.

you can run and test it on jsbin

function func() {};

new func(x, y, z);

// Create a new instance using function prototype.
var newInstance = Object.create(func.prototype)

// Call the function
var result = func.call(newInstance, x, y, z),

// If the result is a non-null object then use it otherwise just use the new instance.
console.log(result && typeof result === 'object' ? result : newInstance);

6. ES6 Class Syntax: ES6 introduces a class feature for creating objects.

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

var object = new Person("Sonu");

console.log(object);

you can run and test it on jsbin

7. Singleton Pattern: A Singleton is an object that can only be instantiated once. Subsequent calls to its constructor return the same instance.

var object = new (function () {
this.name = "Sonu";
})();

console.log(object);

you can run and test it on jsbin

These diverse approaches provide flexibility for object creation in JavaScript, catering to different scenarios and preferences.

To get updates for my new stories, follow me on Medium and Twitter

--

--

Sonu Kumar

I'm passionate about Web development with 8 Years of experience and I love helping to everyone by sharing knowledge & enhancing their skills.