DEV Community

Cover image for Object Creation Methods — JavaScript
Manoj
Manoj

Posted on

2

Object Creation Methods — JavaScript

In JavaScript, almost “everything” is an object. Understanding how to create and work with objects effectively is fundamental to becoming proficient in JavaScript development.

All the objects created inherits directly from the built-in Object.prototype by default.

There are several ways to create object in JavaScript. Here are some common methods:

1. Object Literals

Simple and Straightforward way to create a object without specifying a prototype explicitly.

const obj = {
    property1: "value1",
    property2: "value2"
};
Enter fullscreen mode Exit fullscreen mode

2. Using the new keyword with Object Constructor

We can create objects using the built-in Object constructor function along with the new keyword.

const obj = new Object();
obj.key1 = value1;
obj.key2 = value2;
Enter fullscreen mode Exit fullscreen mode

3. Object.create() Method

Unlike other object creating methods Object.create() allows us to explicitly specify the prototype of the newly created object.

const prototypeObject = {}; // Prototype object
const obj = Object.create(prototypeObject);
Enter fullscreen mode Exit fullscreen mode

Prototype chain of the new object will include the prototypeobject provided as an argument, and ultimately, it will inherit from Object.prototype.

4. Factory Functions

A simpler approach to create objects by encapsulating the object creation process within a function.

function myFunction(key1, key2) {
    return {
        key1: key1,
        key2: key2
    };
}

const obj = myFunction(value1, value2);
Enter fullscreen mode Exit fullscreen mode

5. Using Function Constructors

We can define a constructor function and then create objects from it using the new keyword which is useful for creating multiple objects with the same structure.

Constructor functions typically start with a capital letter by convention.

function MyObject(key1, key2) {
    this.key1 = key1;
    this.key2 = key2;
}
const obj = new MyObject(value1, value2);
Enter fullscreen mode Exit fullscreen mode

6. Using ES6 Classes

Introduced in ES6, class syntax allows us to define object blueprints more clearly.

Classes are primarily syntactical sugar over JavaScript’s existing prototype-based inheritance.

class MyClass {
    constructor(key1, key2) {
        this.key1 = key1;
        this.key2 = key2;
    }
}
const obj = new MyClass(value1, value2);
Enter fullscreen mode Exit fullscreen mode

Quick Question: Is it possible to create an object with no prototype methods?


Thank you for reading! I hope you found this blog informative and engaging. If you notice any inaccuracies or have any feedback, please don’t hesitate to let me know.

Reinvent your career. Join DEV.

It takes one minute and is worth it for your career.

Get started

Top comments (2)

Collapse
 
jonrandy profile image
Jon Randy 🎖️

You missed Object.fromEntries

Collapse
 
manojravi profile image
Manoj

Thank you for your feedback! I see your point about Object.fromEntries(). While it’s a useful method for transforming an iterable into an object, I focused on direct object creation methods in my post. If you'd like, I can discuss its use and benefits further!

This post blew up on DEV in 2020:

js visualized

🚀⚙️ JavaScript Visualized: the JavaScript Engine

As JavaScript devs, we usually don't have to deal with compilers ourselves. However, it's definitely good to know the basics of the JavaScript engine and see how it handles our human-friendly JS code, and turns it into something machines understand! 🥳

Happy coding!

👋 Kindness is contagious

Engage with a sea of insights in this enlightening article, highly esteemed within the encouraging DEV Community. Programmers of every skill level are invited to participate and enrich our shared knowledge.

A simple "thank you" can uplift someone's spirits. Express your appreciation in the comments section!

On DEV, sharing knowledge smooths our journey and strengthens our community bonds. Found this useful? A brief thank you to the author can mean a lot.

Okay