Object Operations

Following are two ways of accessing & manipulating Object :-

1. Dot Notation - The Static Interface

• Restriction: The key must be a valid Identifier (no spaces, can't start with a number, no special characters).
• Limitation: It is Static. We cannot use a variable. The engine interprets the text after the dot literally.

2. Bracket Notation - The Dynamic Interface

• Capability: It evaluates the expression inside the brackets before accessing the property.
• Use Case: Accessing properties dynamically (e.g., from user input) or properties with "illegal" names (e.g., "Content-Type").
• Computed Property Names (ES6): The ability to use brackets directly inside an object literal definition.

Example:

let key = "status";
let data = {
  [key]: "Active", // Creates { status: "Active" }
  ["user_" + 101]: 123, // Creates { user_101: 123 }
};

Implicit Conversion

This is the most fundamental architectural Limitation of standard JavaScript Objects.

In a standard Object, all keys are Strings. If we try to use any other data type as a key, the engine will Implicitly convert it to a string before storage.

Consider this scenario where we try to use Objects as keys:

let user = { id: 1 };
let admin = { id: 2 };
 
let dictionary = {};
dictionary[user] = "User Data";
dictionary[admin] = "Admin Data";
 
console.log(dictionary[user]); // Output: "Admin Data"

• The Mechanism:

  1. The engine receives an Object (user) as a key.
  2. It calls .toString() on the object.
  3. The result is the generic string "[object Object]".
  4. It saves the value under that string key.
  5. It repeats the process for admin, which generates the exact same key "[object Object]", overwriting the first entry.

• The Limitation: Standard Objects cannot handle unique object references as keys. They only see the string representation. (To use actual objects as keys, we use the Map data structure).

Iteration Strategies

1. for...in Loop

Legacy method. Iterates over enumerable properties (including inherited ones).

const user = { name: "Alice", role: "Admin" };
 
for (let key in user) {
  console.log(key, user[key]);
}
// Output: "name" "Alice", "role" "Admin"

2. Object.keys()

Returns an array of the object's own keys.

const user = { name: "Alice", role: "Admin" };
 
// Returns: ["name", "role"]
Object.keys(user).forEach((key) => {
  console.log(key);
});

3. Object.values()

Returns an array of the object's own values.

const user = { name: "Alice", role: "Admin" };
 
// Returns: ["Alice", "Admin"]
Object.values(user).forEach((value) => {
  console.log(value);
});

4. Object.entries()

Returns an array of [key, value] pairs. Useful for destructuring.

const user = { name: "Alice", role: "Admin" };
 
// Returns: [ ["name", "Alice"], ["role", "Admin"] ]
Object.entries(user).forEach(([key, value]) => {
  console.log(`${key}: ${value}`);
});

Summary Table