In JavaScript, almost “everything” is an object.
- Booleans can be objects (if defined with the new keyword)
- Numbers can be objects (if defined with the new keyword)
- Strings can be objects (if defined with the new keyword)
- Dates are always objects
- Maths are always objects
- Regular expressions are always objects
- Arrays are always objects
- Functions are always objects
- Objects are always objects
All JavaScript values, except primitives, are objects.
In this post I give 7 ways to create object in javascript.
1. Object literal syntax
This is the easiest way in JavaScript to create an object. It uses notation to initialise an object.
const person = {
firstName: “John”,
lastName: “Doe”
}
2. Object constructor
Object Constructor uses new keyword to create an object from Object class.
const person1 = new Object ();
const person2 new Object ();
//Adding the properties on person1 object
person1.firstName = “John”;
person1.lastName = “doe”;
//Adding the properties on person2 object
person2.firstName = “Jane";
person2.lastName = “doe";
3. Constructor Function
Constructor function uses new keyword to create an object from a function similar like object constructor.
Creating an object using the constructor function takes less efforts. Because adding properties manually is really painful when creating multiple objects using an object constructor.
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
const person1 = new Person('John', 'Doe');
const person2 = new Person(' Jane', 'Doe');
4. Es6 classes
ECMAScript 2015 (ES6) is a modern way of creating an object using new keyword instead of constructor function.
class Person {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
}
const person1 = new Person('John', 'Doe');
const person2 = new Person(' Jane', 'Doe');
5. Object.create()
Object.create() is a prototype method that creates a new object using the prototype of the existing object provided as a first parameter.
const person1 = {
name: “John Doe”
const person2 = Object.create(person1);
console.log(person2); // { name: 'John Doe’ }
6. Object.assign()
Object.assign() is another prototype method of Object that is used to create a new object.
It copies one or more source objects into the target object. This method is really helpful for cloning or merging objects.
const person1 = { firstName: “John” };
const person2 = { lastName : “Doe" };
const target = Object.assign({}, person1, person2);
console.log(target); // { firstName: “John”, lastName : “Doe" }
console.log(person1) ; // { firstName: “John” }
console.log(person2); // { lastName : “Doe” }
7. Object spread {…}
The object spread operator is the new way of cloning or merging the objects introduced in ECMAScript 2018.
Since most of the browsers are yet to implement ES2018, we can use this feature with compilers like Babel.js.
const source = { firstName: "John" };
const target = { …source };
console.log(target); // { firstName: “John” }
console.log(source); // { lastName : “John” }