Exploring the Many Ways to Create JavaScript Objects
As a programmer, we encounter JavaScript objects in the form of JSON almost every day. While most of us have used JavaScript (or JSON) at some point, we rarely consider how many ways there are to create JavaScript objects and why there are so many options.
Let’s explore some of the significant ways to create JavaScript objects:
1. Using Object Literal:- Initializing an object with object literals is the best way to create a new object in JavaScript. As soon as the interpreter sees the curly bracket, it knows that it has to create an object. This method is more efficient than other ways, which require the interpreter to lex at least six more symbols.
Example:
var a={};
2. Using Constructor Functions:- Constructor Functions: This is a great way to create similar objects repeatedly. Although there is no restriction on how to write a constructor function, it is recommended to have the first letter of the constructor function capitalized and other letters in the camel case.
Example:
function Person(first, last, age, eye) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eye;
}
var myFather = new Person("John", "Doe", 50, "blue");
var myMother = new Person("Sally", "Rally", 48, "green");
3. Using Classes:- In almost all object-oriented programming languages, classes are used to create objects or implement inheritance. As per ES5, there was no concept of classes, but in ES6, JavaScript not only got classes but also got concepts like “static” and “extend,” just like Java. The primary reason for using classes is that it provides a better understanding while implementing inheritance, and we can create static members only in this way.
class Cat {
constructor(name) {
this.name = name;
}
speak() {
console.log(this.name + ' makes a noise.');
}
}
class Lion extends Cat {
speak() {
super.speak();
console.log(this.name + ' roars.');
}
}
While using classes, we need to take care of a few things:
a. If we declare/define a constructor in the child class, we have to call the constructor of the super class, even if there are no implementations in the super class constructor.
b. The “extends” keyword works only with classes or constructor functions and not with objects.
4. Using Object.create():- The create() method in Object helps in creating a new object with a passed object as the prototype of the new object. This method is useful as it provides inheritance on the object level, and we don’t need any constructor for inheritance.
Example:
// Animal properties and method encapsulation
var Animal = {
type: 'Invertebrates', // Default value of properties
displayType: function() { // Method which will display type of Animal
console.log(this.type);
}
};
// Create new animal type called animal1
var animal1 = Object.create(Animal);
animal1.displayType(); // Output:Invertebrates
// Create new animal type called Fishes
var fish = Object.create(Animal);
fish.type = 'Fishes';
fish.displayType(); // Output:Fishes
5. Using new Object():- This method works exactly like two curly brackets ({}) when no parameters are passed. However, when a parameter is passed, it creates a wrapper class for the type of the parameter.
var firstName = new Object("John");
//same as var firstName2 = new Object("John");
var num = new Object (10);
// same as var = new Number(10);
Although this method may not seem very useful, it can come in handy when we don’t know what kind of response we might receive and need to perform different actions based on the response type.
