Objects in JavaScript

Before knowing about the object, I want to tell you about my new Mobile phone, Can you guess my mobile's (Company, Model, Color, Ram, Rom, Battery, Camera, Price).🫥

Don't Worry i will tell you about my phone

Here, (Company , Model ,Color , Ram , Rom , Battery , Camera, Price ) is our key

and (Oppo, OPPO F19 Pro, Black, 8GB, 128GB, 5000 mAh, 48px, 17990) is our value.

We need to know about two words, Before starting to learn about objects. 1st word is key and 2nd word is value.

What is the object in JavaScript?

An object is a data type that can take in collections of key-value pairs.

A major difference between an object and other data types such as numbers and strings in JavaScript is that an object can store different types of data as its values. On the other hand, Primitive data types such as numbers and strings can store only numbers and strings, respectively, as their values.

And the most recognizable feature of an object is the brackets which contain the key-value pair.

How can we create an object in JavaScript?

We have different ways to create an object.

1. Object Literals.

2. new object().

3. Object.create() Method.

4. Constructor Functions.

Let’s look at each one of them in detail.

1. Object Literals:-

Object literals are a comma-separated list of key-value pairs wrapped in curly braces.

With the Object literals, we can create a new object. for example, the following example code creates a student object with three properties

const student = {
    firstName : "Vinayak",
    lastName : "Singh",
    age : 26
}
console.log(obj);
// { firstName: 'Vinayak', lastName: 'Singh', age: 26 }

2. new object():-

The second method of creating a JavaScript object is to use the new keyword.

In the example, we are creating a new object with new Object(). after creating an object if we want to add some key- value-pairs in our object so we can use dot notation or bracket notation.

Here we have created a student object. then, we simply set its properties (id, name) using dot notation and age set by bracket notation.

For Example:-

const student = new Object();
student.id = 1;
student.name = "Vinayak Singh"
student['age'] = 26
console.log(student);
// { id: 1, name: 'Vinayak Singh', age: 26 }

3. Object.create() Method:-

We can also create a new object using the Object.create() method,which allows us to use an existing object literal as the prototype of a new object we create. Let’s say we want to create a student1 object that has the same properties and methods as student2 just with different values.

We use the Object.create() method to instantiate the new student1 object. We need to add student2 as an argument of the create() method, as that will be the prototype of the new object. Then, we simply set the values for the three properties (firstName, lastName, age) using the familiar dot notation.

const student1 = {
    firstName : "Vinayak",
    lastName : "Singh",
    age : 26
}

const student2 = Object.create(student1)
student2.name = "Amit";
student2.lastName = "Pandey";
student2.age = 38;
console.log(student2)
// { name: 'Amit', lastName: 'Pandey', age: 38 }

4. Constructor Functions.

If you want to create more than one object. So it is always better to use the object constructor. It allows you to avoid unnecessary repetition in your code and also makes it easier to change the properties of your object.

Here I am creating two objects student1 and student2 with (firstName, lastName, age) properties.

function student(firstName , lastName , age){
    this.firstName = firstName;
    this.lastName = lastName;
    this.age = age

}
let student1 = new student("Vinayak" , "Singh", 26)
let student2 = new student("Amit", "Pandey" , 28 )