JavaScript Objects

In this tutorial, you’ll learn about the JavaScript Objects and how to create an object in different ways and it’s working. In JavaScript, objects are king. If you understand objects, you understand JavaScript.

What is JavaScript Objects

In JavaScript, almost “everything” is an object. An object is a collection of key/value pairs or properties. 

• 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.

How to create a JavaScript Objects

With JavaScript, you can define and create your own objects.

There are different ways to create new objects:

• Create a single object, using an object literal.
• Create a single object, with the keyword new.
• Define an object constructor, and then create objects of the constructed type.
• Create an object using Object.create().

1. Using an Object Literal

This is the most common and concise way to create an object. Using an object literal, you both define and create an object in one statement.

An object literal is a list of name:value pairs (like age:20) inside curly braces {}.

// Creating an object using object literal notation
let person = {
  firstName: "Anup",
  lastName: "Maurya",
  age: 25,
  greet: function() {
    console.log("Namaste!");
  }
};

// Accessing properties and methods
console.log(person.firstName);  // Output: Anup
console.log(person["lastName"]);  // Output: Maurya
console.log(person.greet());    // Output: Namaste!

In this example, an object named person is created using object literal. The object has properties like firstName, lastName and age. It also has a method greet that can be used to log a greeting. This is a straightforward and concise way to create an object.

2. Using an Object Constructor

// Creating a single object with the keyword 'new'
let person = new Object();
person.firstName = "Anup";
person.lastName = "Maurya";
person.age = 25;
person.greet = function() {
  console.log("Namaste!");
};

Here, an object named person is created using the Object constructor along with the new keyword. Properties (firstName, lastName, age, etc.) are added to the object using dot notation. This approach is less common than object literal notation but provides another way to create objects.

3. Using an Object Constructor and Instances

// Define an object constructor
function Person(firstName, lastName, age, isStudent) {
  this.firstName = firstName;
  this.lastName = lastName;
  this.age = age;
  this.isStudent = isStudent;
  this.greet = function() {
    console.log("Namaste!");
  };
}

// Create objects of the constructed type
let person1 = new Person("Anup", "Maurya", 25, false);
let person2 = new Person("Rakesh", "Jain", 30, true);

In this example, an object constructor function Person is defined. It takes parameters for the properties and assigns them to the object using this. Two objects (person1 and person2) are then created using the constructor with the new keyword.

4. Using an Object.create()

// Create an object using Object.create()
let personPrototype = {
  greet: function() {
    console.log("Namaste!");
  }
};

let person = Object.create(personPrototype);
person.firstName = "Anup";
person.lastName = "Maurya";
person.age = 25;
person.isStudent = false;

In this example, an object named personPrototype is created with a method greet. The Object.create() method is used to create a new object (person) that inherits properties and methods from personPrototype. Properties like firstName, lastName, age, and isStudent are then added to the new object. This is a way to achieve prototypal inheritance in JavaScript.

For readability, simplicity and execution speed, use the object literal method.