Skip to content

JavaScript object create vs new

  • by

JavaScript object create vs new keywords are both used to create objects, but they differ in their approach and behavior. The Object.create() creates a new object with an existing object as its prototype, while new is used to create a new instance of a constructor function.

JavaScript object create vs new examples

Simple example code with both methods.

Object.create() is a method that creates a new object, using an existing object as the prototype of the new object. This allows you to create a new object that inherits properties and methods from the prototype object. This method takes one argument, which is the object that will be used as the prototype of the new object.

<!DOCTYPE html>
<html>
<body>
    <script>
    const person = {
        firstName: "John",
        lastName: "Doe",
        getFullName() {
            return `${this.firstName} ${this.lastName}`;
        }
    };

    const john = Object.create(person);

    console.log(john.firstName); 
    console.log(john.getFullName());
    
    </script>
</body>
</html>

Output:

JavaScript object create vs new

The new keyword is used to create a new instance of a constructor function. When a constructor function is called using new, a new object is created and assigned to the this keyword inside the constructor function.

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
  this.getFullName = function() {
    return `${this.firstName} ${this.lastName}`;
  }
}

const john = new Person("John", "Doe");

console.log(john.firstName); // "John"
console.log(john.getFullName()); // "John Doe"

Here is a tabular representation of the differences between Object.create() and new in JavaScript:

FeatureObject.create()new
Prototype objectTakes an existing object as the prototype of the new objectInherits from the constructor’s prototype property
Constructor functionNot usedUsed to create a new instance
Instance propertiesNot set during creationSet using this keyword inside the constructor
FlexibilityMore flexible, allows creating objects with different prototypesLess flexible, creates instances of a specific constructor function
SyntaxObject.create(prototypeObject)new ConstructorFunction(arguments)

In summary, Object.create() is more flexible and allows you to create objects with different prototypes, while new is a more straightforward way to create instances of a specific constructor function.

Object create() takes an existing object as the prototype of the new object, while new uses the prototype property of the constructor function to create new objects. Finally, Object.create() does not require a constructor function, while new can only be used with constructor functions.

Comment if you have any doubts or suggestions on this Js difference topic.

Note: The All JS Examples codes are tested on the Firefox browser and the Chrome browser.

OS: Windows 10

Code: HTML 5 Version

Leave a Reply

Discover more from Tutorial

Subscribe now to keep reading and get access to the full archive.

Continue reading