DEV Community

Akshat Sharma
Akshat Sharma

Posted on

Day 14 of 30 of JavaScript

Hey reader👋 Hope you are doing well😊
In the last post we have seen an introduction of OOPs. In this post we are going to know about objects in JavaScript, we are going to start from very basic and take it to advanced level.
So let's get started🔥

What are Objects?

In JavaScript, an object is a collection of properties, where each property is associated with a key (also known as a name or identifier) and a value. Objects can be used to store related data and functionalities together, allowing for more organized and modular code.
Example -:
const man={
name:"John",
age:45,
nationality:"Indian",
country:"India"
}

So this is a man object which has name, age, nationality and country as its properties.
These properties are key-value pair the entity present on left side of colon is key and the entity to the right of colon is value.
The object can contain methods too.
The objects are dynamic in nature i.e. properties and methods can be added or deleted at any time.

But you may be thinking that earlier we have defined objects as instace of classes but here we are defining it in other way?? 🤔
The reason is simple we are using objects in different ways due to the flexible nature of JavaScript. JavaScript is not class based OOPs but it does support class based OOPs in ES6.

Creating a JavaScript Object

Image description
Using new()
Image description
Object Literal
Image description
Using Constructor
Constructor Function is used to initialize the properties of a class or function.
Image description
So here to create person1 object we will call constructor function with name and age as arguments , the name key in constructor function will get value provided by us.
Using constructor function we can define different objects of same type.

These are the four ways through which we can create JavaScript object.

Accessing and Modifying Properties

We can the property of Object using .(dot) notation or [](bracket) notation.
Image description

Nearly everything in JavaScript is object, we have arrays as objects, maps as objects,dates as objects and many more are there.

Object Prototype

In simple terms, the object prototype in JavaScript is like a blueprint or template that defines properties and methods that all objects inherit by default. It's a way for objects to share behavior and functionality without duplicating code.
Example-:
Image description
Here you can see that we have defined a template for animal and later used this as prototype and with the help of this created a dog object.

Now you may be thinking that we have constructor function through which we can create different objects of same type then why we are in need of this Prototype?🤔

So here are some reasons-:

  • Prototypes allow for more memory-efficient code. When you create objects using a constructor function, each instance gets its own copy of methods defined within the constructor. In contrast, methods defined on a prototype are shared among all instances, reducing memory usage.
    Image description
    In this case, person1 and person2 each have their own sayHello method, which consumes additional memory for each instance.
    Image description
    In this case, person1 and person2 both reference the same sayHello method defined on the prototype. This means that the method is stored only once in memory and shared among all instances, leading to memory savings.

  • Prototypes enable you to add or modify properties and methods dynamically, even after objects have been created.

  • You can extend built-in JavaScript objects, such as Array, String, and Object, by adding custom methods to their prototypes. This enables you to enhance the functionality of these objects to suit your specific needs.

This is it for Objects I hope you have understood it well. In the coming blogs we will learn more about the objects. In the next blog we are going to learn about this keyword. Till then stay connected and don't forget to follow me .
Thankyou🤍

Top comments (0)