Understanding Objects in JavaScript

Imagine you’re playing BGMI. Your backpack has different items like:

• Medkit – heals 50 HP

• Energy Drink – restores stamina

• Grenade – explosive damage 100

• Ammo – 30 bullets

Each item has a name and some attributes. Instead of creating separate variables for each attribute, you can store everything in a single object.

This is exactly what JavaScript objects do. They help you store related data together using key-value pairs.

What Objects Are and Why We Need Them

An object is like a backpack in your game:

• Keys – They are like item names: Medkit, Grenade

• Values – They represent details like healing power, explosive damage, or quantity

Objects help you:

• Keep related data organized

• Access and update items easily

• Avoid messy code with dozens of variables

• let backpack = {
    medkit: 50,
    energyDrink: 30,
    grenade: 100,
    ammo: 30
  };
  

  Here backpack is our object. Each item in the backpack is a key and its stats are the value.

  Creating Objects

  We can create the objects in JavaScript using the curly braces {}.

  let backpack = {
    medkit: 50,
    energyDrink: 30,
  };
  

  medkit is key and 50 is value. In objects you can add as many items as you like.

  Accessing Properties

  You can access object properties in two ways

  1. Dot Notation

  console.log(backpack.medkit); // 50
  

  1. Bracket Notation

  console.log(backpack["energyDrink"]); // 30
  

  Use bracket notation if the key name has spaces or special characters

  let backpack = {
    "first aid kit": 50
  };
  console.log(backpack["first aid kit"]); // 50
  

  Updating Object Properties

  Just like adding more bullets to your ammo, you can update object values easily.

  backpack.ammo = 50; // Update ammo from 30 to 50
  console.log(backpack.ammo); // 50
  

  Adding and Deleting Properties

  Adding a new item to your backpack

  backpack.sniperRifle = 1; // Add sniper rifle
  console.log(backpack.sniperRifle); // 1
  

  Deleting an item from your backpack

  delete backpack.grenade;
  console.log(backpack.grenade); // undefined
  

  Looping Through Object Keys

  Imagine you want to print all items in your backpack. You can loop through object keys using for...in

  for (let item in backpack) {
    console.log(item + " : " + backpack[item]);
  }
  

  output:

  medkit : 50
  energyDrink : 30
  ammo : 50
  sniperRifle : 1
  

  Object vs Array

  • Array → list of similar items in order. Example: ["medkit", "grenade", "ammo"]

  • Object → collection of key-value pairs for related data. Example: { medkit: 50, grenade: 100 }

  Think of an array as your inventory list and an object as your detailed backpack with stats.

  Practice Challenge

  Task

  1. Create an object called student.

  2. Add the following properties:

     • name

     • age

     • course

  3. Update one of the properties (for example, change the course).

  4. Add a new property called city.

  5. Use a loop to print all keys and values from the object.

  Final Thoughts

  Objects are one of the most important building blocks in JavaScript. They allow us to group related information together in a clear and organized way.

  Instead of creating many separate variables, objects let us store everything inside a single structure using key-value pairs.

  Just like your BGMI backpack keeps all your items organized, JavaScript objects keep related data together so it becomes easier to access, update, and manage.

  Once you become comfortable with objects, you will start using them everywhere in JavaScript from handling user data to working with APIs and building real applications.