⭐ JavaScript Object Manipulation: Complete Guide

  

An article to bookmark to always have at hand:

• every fundamental operation on JavaScript objects explained clearly and completely
• all the essential references for working with objects in JavaScript!

🔗 Do you like Techelopment? Check out the website for all the details!

Objects in JavaScript are one of the most fundamental and powerful data structures. They allow you to represent complex entities, group related data, and define behavior through methods. In this guide, we’ll explore all the core operations for creating and manipulating objects in JavaScript, with explanations and practical examples.

1. Creating an Object

You can create an object using the object literal, the most common and readable method:

const person = {
  name: "Alice",
  age: 30,
  isEmployed: true
};

Alternatively, you can use the Object constructor:

const person = new Object();
person.name = "Alice";
person.age = 30;

2. Accessing Object Properties

You can read properties using dot notation or bracket notation:

console.log(person.name);        // "Alice"
console.log(person["age"]);      // 30

3. Modifying Object Properties

To update a property’s value, simply assign a new value to it:

person.age = 31;
person["isEmployed"] = false;

4. Adding New Properties

Assigning a new key will automatically add that property to the object:

person.city = "New York";
person["country"] = "USA";

5. Removing a Property

Use the delete operator to remove a property:

delete person.age;
delete person["isEmployed"];

6. Checking Property Existence

You can check if a property exists using the in operator or hasOwnProperty method:

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

7. Object Methods

A method is a function defined inside an object. You can use this to refer to the object itself:

const person = {
  name: "Alice",
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

person.greet(); // "Hello, my name is Alice"

8. Looping Through Properties

Use for...in to loop through all enumerable properties:

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

Or use Object.keys(), Object.values(), and Object.entries() for more control:

Object.keys(person).forEach(key => console.log(key));
Object.values(person).forEach(value => console.log(value));
Object.entries(person).forEach(([key, value]) => console.log(key, value));

9. Object Destructuring

Destructuring is a concise ES6 syntax for extracting properties into variables:

const person = {
  name: "Alice",
  age: 30,
  city: "New York"
};

const { name, age } = person;
console.log(name); // "Alice"
console.log(age);  // 30

You can also use default values or aliases:

const { country = "USA", city: hometown } = person;
console.log(country);  // "USA"
console.log(hometown); // "New York"

10. Spread Operator (ES6)

The spread operator (...) allows you to clone or merge objects easily:

const person = { name: "Alice", age: 30 };
const job = { title: "Developer" };

const employee = { ...person, ...job };
console.log(employee); // { name: "Alice", age: 30, title: "Developer" }

You can also use it to override properties:

const updatedPerson = { ...person, age: 31 };
console.log(updatedPerson); // { name: "Alice", age: 31 }

Conclusion

Mastering object manipulation is essential in JavaScript. Knowing how to create, read, modify, iterate, and destructure objects helps you write cleaner and more efficient code. Objects are the backbone of JavaScript — from basic data structures to full object-oriented programming.

Follow me #techelopment

Official site: www.techelopment.it
facebook: Techelopment
instagram: @techelopment
X: techelopment
Bluesky: @techelopment
telegram: @techelopment_channel
whatsapp: Techelopment
youtube: @techelopment