Skip to main content

Command Palette

Search for a command to run...

Understanding Objects in JavaScript

Updated
3 min readView as Markdown
Understanding Objects in JavaScript

Object are the collection of uncategoried data which can be stored in the variable. Collection of values in key value pair or we can say that complex data can store in the object make code more readable and organized. like and value can be every type of data.

collection of value with their labels can store in the variables

let person = {
  name: "JD",      // key: "name",  value: "Aryan"
  age:  36,          // key: "age",   value: 22
  city: "Noida",     // key: "city",  value: "Delhi"
  isStudent: true   // values can be any type
};

Access values/properties

2 ways of access value (dot and bracket notations)

let person = {
  name: "JD",      // key: "name",  value: "Aryan"
  age:  36,          // key: "age",   value: 22
  city: "Noida",     // key: "city",  value: "Delhi"
  isStudent: true   // values can be any type
};

// Access value through dot notations
console.log(person.name) // JD

// Access value through Bracket notations
console.log(person[age]) // 36

// both ways can access the any type of values

Updating Values

let person = {
  name: "JD",      // key: "name",  value: "Aryan"
  age:  36,          // key: "age",   value: 22
  city: "Noida",     // key: "city",  value: "Delhi"
  isStudent: true   // values can be any type
};

console.log(person.city) // Noida

person.city = "Delhi"

console.log(person.city) // Delhi

we can update values through both dot and bracket notations

Adding & Deleting Properties

let person = {
  name: "JD",      // key: "name",  value: "Aryan"
  age:  36,          // key: "age",   value: 22
  city: "Noida",     // key: "city",  value: "Delhi"
  isStudent: true   // values can be any type
};

person.email = "name@example.com"

console.log(person) 
//{name: 'JD', age: 36, city: 'Noida', isStudent: true, email: 'name@example.com'}

delete person.age
console.log(person) 
//{name: 'JD', city: 'Noida', isStudent: true, email: 'name@example.com'}

delete can help you to remove key and value

we can add values through both dot and bracket notations

Loop for Object

for... in loop can be used for object key and values like:

let person = {
  name: "JD",      // key: "name",  value: "Aryan"
  age:  36,          // key: "age",   value: 22
  city: "Noida",     // key: "city",  value: "Delhi"
  isStudent: true   // values can be any type
};

for (let key in person){
    console.log(key, " value is ", person[key])
}

// name  value is  JD
// age  value is  36
// city  value is  Noida
// isStudent  value is  true

Object vs Array

Feature Object Array
Structure key-value indexed list
Access, add and update values obj.key arr[0]
Use real-world entities lists of items
loop for...in for.. of

Summary

An object is a collection of related data and/or functionality. Unlike an array, which is an ordered list, an object is a structure where you give every piece of data a "label" (the key) so you can find it easily.

  • Objects store related data together

  • Use dot notation for simple access

  • Use bracket notation for dynamic keys

  • Use for...in to loop through properties

Understanding Objects in JavaScript