# Objects in JavaScript: A Complete Beginner-Friendly Guide

# Objects

Objects are one of the most important parts of JavaScript.  
They let you store related information together and describe real-world things in code.

In this article, you will learn:

* what objects are
    
* how to create them
    
* how to access and update properties
    
* how to add methods
    
* how nested objects work
    
* how to loop through objects
    
* common mistakes
    
* best practices
    

Let’s begin.

---

## What Is an Object?

An object stores data in **key–value pairs**.

Each key is called a **property name**, and each value can be anything:

* number
    
* string
    
* boolean
    
* array
    
* another object
    
* or even a function
    

Here is a simple example:

```javascript
const person = {
  name: "John",
  age: 25,
  isStudent: false
};
```

This object has three properties:

* `name`
    
* `age`
    
* `isStudent`
    

---

# How to Create Objects

JavaScript gives you many ways.

---

## 1\. Object Literal (Most Common)

```javascript
const user = {
  username: "sam",
  score: 100
};
```

This is the simplest and most used method.

---

## 2\. Using the Object Constructor

```javascript
const user = new Object();
user.name = "Sam";
user.age = 22;
```

Not very common today.

---

## 3\. Using a Function (Constructor Function)

```javascript
function Person(name, age) {
  this.name = name;
  this.age = age;
}

const p1 = new Person("Asha", 20);
```

Useful in older codebases.

---

## 4\. Using Classes (Modern & Recommended)

```javascript
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

const p1 = new Person("Asha", 20);
```

This is the modern OOP approach.

---

# Accessing Object Properties

There are two ways:

---

## 1\. Dot Notation

```javascript
console.log(person.name);
console.log(person.age);
```

Dot notation is clean and easy.

---

## 2\. Bracket Notation

```javascript
console.log(person["name"]);
```

Use brackets when:

* the key has spaces
    
* the key has special characters
    
* the key is dynamic
    

Example:

```javascript
const key = "first-name";
const user = { "first-name": "Karan" };

console.log(user[key]); // Karan
```

---

# Adding and Updating Properties

### Add new property

```javascript
person.city = "Mumbai";
```

### Update existing property

```javascript
person.age = 26;
```

---

# Deleting Properties

Use the `delete` keyword:

```javascript
delete person.isStudent;
```

---

# Methods in Objects

A method is a function stored in an object.

```javascript
const car = {
  brand: "Toyota",
  start() {
    console.log("Car started");
  }
};

car.start();
```

---

# Nested Objects

Objects can contain other objects.

```javascript
const student = {
  name: "Ravi",
  marks: {
    maths: 90,
    science: 95
  }
};

console.log(student.marks.maths); // 90
```

---

# Objects Inside Arrays

Very common in real apps.

```javascript
const users = [
  { name: "Sam", age: 20 },
  { name: "Mira", age: 22 }
];

console.log(users[1].name); // Mira
```

---

# Looping Through Objects

## 1\. `for…in`

```javascript
for (let key in person) {
  console.log(key, person[key]);
}
```

---

## 2\. `Object.keys()`

```javascript
Object.keys(person); // ["name", "age"]
```

---

## 3\. `Object.values()`

```javascript
Object.values(person); // ["John", 25]
```

---

## 4\. `Object.entries()`

```javascript
Object.entries(person);
// [["name", "John"], ["age", 25]]
```

Useful for converting objects to arrays.

---

# Copying Objects

Objects are copied **by reference**, not by value.

This means:

```javascript
const a = { x: 1 };
const b = a;

b.x = 5;

console.log(a.x); // 5
```

Both variables point to the same object.

---

## To actually copy an object:

### 1\. Using Spread Operator

```javascript
const copy = { ...person };
```

### 2\. Using `Object.assign()`

```javascript
const copy = Object.assign({}, person);
```

---

# Checking if a Property Exists

### Using `in`

```javascript
"name" in person; // true
```

### Using `hasOwnProperty()`

```javascript
person.hasOwnProperty("age"); // true
```

---

# Comparing Objects

Objects are never equal unless they reference the same memory.

```javascript
{} === {} // false
```

This is a key difference from primitive types.

---

# Common Mistakes

### ❌ Using dot notation for invalid keys

```javascript
user.first-name // error
```

Use brackets.

---

### ❌ Confusing reference copy with value copy

```javascript
const x = { a: 1 };
const y = x; // not a new copy
```

---

### ❌ Forgetting that arrays and functions are objects

```javascript
typeof [] // "object"
typeof function() {} // "function" (but still an object)
```

---

# Best Practices

✔ Use object literals when possible  
✔ Use dot notation for clean code  
✔ Use brackets for dynamic or special keys  
✔ Use `const` for objects to avoid reassigning  
✔ Use spread syntax to copy objects  
✔ Use classes when modeling complex structures

---

# Summary

| Concept | Example | Notes |
| --- | --- | --- |
| Create object | `{ name: "A" }` | Most common |
| Access property | [`obj.name`](http://obj.name) | Dot notation |
| Dynamic access | `obj[key]` | Bracket notation |
| Add property | `obj.age = 30` |  |
| Delete property | `delete obj.age` |  |
| Loop keys | `for...in` | Iterates over keys |
| Copy object | `{ ...obj }` | Shallow copy |
| Nested objects | `obj.inner.value` | Very common |