Mastering Object In Javascript

In my previous blogs we have studied about the arrays Js arrays and array methods Array Methods . In this blog we will gonna learn about objects in js.

Suppose we are creating a banking management system and need to store data related to an account such as account ID, account holder name, creation date, account balance, and other details. Storing this information separately would make the data difficult to manage. Instead, we want all the account-related data to be grouped together in one place.

We could use arrays for this purpose, but arrays have a limitation: their indexes are always numeric, which means we cannot use meaningful names like "accountId" or "balance" as keys. In many situations, we need more descriptive and flexible keys. This is where objects become useful.

In JavaScript, an object is a collection of key–value pairs, where the key is usually a string and the value can be any data type.

How to create a object in js?

There are several ways to create a object in js .

• Object literal

• Object constructor ( new Object() )

• Using a Constructor Function

• Using Object.create()

we are just gonna look at some of the ways .

Object literal ( {} ):

const account={
"id":678234,
"name":"Karan",
"balance":100000
}
console.log(account)

Output:

{
"id":678234,
"name":"Karan",
"balance":100000
}

in js the keys in object always string or either symbol and value can be of any type.

Object constructor ( new Object() ):

const account = new Object();

account.accountId = 101;
account.holderName = "Karan";
account.balance = 5000;

console.log(account);

Output:

{ accountId: 101, holderName: 'Karan', balance: 5000 }

Accessing properties :

• dot notation

const account={
"id":678234,
"name":"Karan",
"balance":100000
}

console.log("the account id is ",account.id)
console.log("the account holder name is ",account.name)
console.log("the account balance is ",account.balance)

Output:

the account id is 678234
the account holder name is Karan
the account balance is 100000

using the dot( . ) with object name we can access any property of the object. But there is a limitation of this syntax that we can not access those key which have space in their name so we use bracket notation for that.

const account={
"holder name":"Karan"
}

console.log(account.holder name)

• sqaure bracket notation ( []):

using the sqaure bracket notation we can access keys with space also .

const account={
"holder name":"Karan"
}

console.log(account["holder name"])

Output:

Karan

Updating objects in js:

We can update the both square bracket and dot notation to update the object.

const account={
"id":678234,
"name":"Karan",
"balance":100000
}
account.balance=150000
console.log(account)

Output:

{
"id":678234,
"name":"Karan",
"balance":150000

}

delete an object property:

we can delete any object property or object using the delete keyword

const account={
"id":678234,
"name":"Karan",
"balance":100000
}
delete account["balance"]
console.log(account)

Output:

//Output
{
"id":678234,
"name":"Karan",
}

Loop through Objects:

we can directly loop through object using for in loop.

const account = {
  name: "Karan",
  balance: 2000,
  city: "Pehowa"
}

for (let key in account) {
  console.log(key, account[key])
}

Output:

name Karan
balance 2000
city Pehowa

we can also loop through only keys, values and entries.

Using Object.keys()

Returns array of keys, so we can loop easily.

const account = {
  name: "Karan",
  balance: 2000
}

Object.keys(account).forEach(key => {
  console.log(key)
})

//Output
"name"
"balance"

Using Object.values()

Loops through values only.

Object.values(account).forEach(value => {
  console.log(value)
})

//Output
Karan
2000

Using Object.entries():

Gives key-value pairs and we can loop on entries.

const account = {
  name: "Karan",
  balance: 2000
}

for (let [key, value] of Object.entries(account)) {
  console.log(key, value)
}

//Output
name Karan
balance 2000

Conclusion:

Objects are one of the most important data structures in JavaScript. They allow us to store related data together using key–value pairs, which makes the data easier to organize and manage. Unlike arrays, where indexes are numeric, objects allow us to use meaningful keys such as accountId, name, or balance, making the code more readable and practical for real-world applications like a banking system.

In this blog, we saw different ways to create objects, such as using object literals and the Object constructor. We also learned how to access object properties using dot notation and bracket notation, especially when keys contain spaces. Additionally, we explored how to update properties, delete properties using the delete keyword, and loop through objects using methods like for...in, Object.keys(), Object.values(), and Object.entries().

Understanding objects is essential because they are widely used in JavaScript for representing structured data. Many advanced concepts in JavaScript, such as JSON, APIs, and real-world application data, rely heavily on objects. By mastering objects, developers can build cleaner, more organized, and more scalable JavaScript programs.