What Is an Object?

• An object is a collection of key-value pairs that store structured data. Each piece of data has a name called a key and a value.
• Objects use names to access values, while arrays access items by number.
• JSON stands for JavaScript Object Notation. JSON is a text format based on object-style key-value pairs, and many apps use it to share and convert data.
• An ID card has labeled fields, so it works as a simple example of labeled information in an object Format. For example, Name has the value Alice, Age has the value 25, and Photo has the value image.

How to Create an Object

JavaScript

const person = {

  name: "Alice",

  age: 25,

  photo: "image"

};

This object is a collection of key-value pairs. Each key has a value. For example, name has the value "Alice", age has the value 25, and photo has the value "image". You can access values by their names, such as person.name or person.age.

How Do You Access Properties and Methods?

• Dot notation is a syntax used to access properties and methods of an object. It is Written as object.property for a property and object.method() for a method.
• Dot notation provides a clean, readable way to drill down into structured data and trigger specific behaviors. This programming syntax is commonly used in JavaScript objects.
• Bracket notation in JavaScript is used to look up, add, modify, and delete properties. It accesses a property by wrapping the property name inside square brackets [].

Example:


const person = {

  name: "Alice",

  age: 25,

  greet() {

    return "Hello";

  }

};

person.name;          // Dot notation: property

person.greet();       // Dot notation: method

person["age"];        // Bracket notation: look up

person["city"] = "Paris"; // Add property

person["age"] = 26;   // Modify property

delete person["city"]; // Delete property

How Can You Modify an Object?

Object modification changes existing values, adds new properties, or removes properties from an object after it is created.

JavaScript

let car = {

  brand: "Toyota",

  year: 2020

};

// Change a property

car.year = 2021;

// Add a new property

car.color = "blue";

// Delete a property

delete car.year;

console.log(car);  // { brand: "Toyota", color: "blue" }

How Are Functions Used as Object Methods?

A function becomes a method after it is stored in an object. The method allows the object to perform specific actions.

Example:

const person = {

  name: "Alice",

  greet: function () {

    return "Hello, " + this.name + "!";

  }

};

console.log(person.greet()); // Hello, Alice! 

What Does the this Keyword Refer To?

The this keyword refers to the current object when it is used inside an object method.

JavaScript

const person = {

  name: "Alice",

  age: 25,

  introduce: function () {

    return "My name is " + this.name + " and I am " + this.age + " years old.";

  }

};

console.log(person.introduce());

// My name is Alice and I am 25 years old.

What Are Nested Objects?

A nested object is an object inside another object.

const student = {

  name: "Alice",

  age: 25,

  address: {

    city: "New York",

    country: "USA"

  }

};

console.log(student.address.city);     // New York

console.log(student.address.country);  // USA

In this example, address is a nested object inside the student object.

What Are the Most Common Object Operations?

How Do You Get All Object Keys?

Object.keys() returns an array containing all property names in an object.

JavaScript

const person = {

  name: "Alice",

  age: 25,

  city: "NYC"

};

console.log(Object.keys(person));

// ["name", "age", "city"]

How Do You Get All Object Values?

Object.values() returns an array containing all property values in an object.

JavaScript

const person = {

  name: "Alice",

  age: 25,

  city: "NYC"

};

console.log(Object.values(person));

// ["Alice", 25, "NYC"]

How Do You Check Whether a Property Exists?

The in operator checks whether an object contains a specific property.

JavaScript

const person = {

  name: "Alice",

  age: 25

};

console.log("name" in person);   // true

console.log("email" in person);  // false

How Do You Loop Through Object Properties?

The for…in loop iterates through each property in an object.

JavaScript

const person = {

  name: "Alice",

  age: 25,

  city: "NYC"

};

for (let key in person) {

  console.log(key + ": " + person[key]);

}

// name: Alice

// age: 25

// city: NYC

What Is Object Destructuring?

Object destructuring extracts property values from an object into separate variables.

JavaScript

const person = {

  name: "Alice",

  age: 25,

  city: "New York"

};

const { name, age } = person;

console.log(name); // Alice

console.log(age);  // 25

In this example, name and age are extracted directly from the person object.

What Are the Key Takeaways?

• Objects store data as key-value pairs, where each key maps to a stored value.
• Properties Access uses dot notation with the syntax obj.key or bracket notation with the syntax obj[“key”].
• Functions stored in objects are called methods, and this refers to the current object inside a method.
• Objects can contain nested objects, which store related data in multiple levels.
• Object.keys() get lists of keys, and Object.values() get lists of values for an object.