DEV Community

Cover image for Object Creation Methods — JavaScript
Manoj
Manoj

Posted on

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.

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!