JavaScript Tutorial
Objects are core to modeling real-world entities in JavaScript. Mastering object behavior is essential for application architecture.
Why this matters
Most business data is represented as objects. Weak object handling creates mutation bugs and unpredictable state.
Use dot notation for known properties and bracket notation for dynamic keys.
Objects can contain nested objects, arrays, and methods for behavior grouping.
Optional chaining prevents crashes when intermediate properties are missing.
Spread syntax creates shallow copies. Nested objects still share references.
Use Object.keys, Object.values, and Object.entries for iteration and transformations.
Prefer immutable update patterns when managing UI or shared state.
const profile = {
name: "Asha",
address: { city: "Jaipur" },
};
console.log(profile.name);
console.log(profile.address?.city);
console.log(profile.company?.name); // undefinedOptional chaining prevents runtime errors on missing paths.
const state = { theme: "light", fontSize: 14 };
const nextState = { ...state, theme: "dark" };
console.log(state.theme, nextState.theme);Creates a new top-level object for safe state updates.
const stats = { users: 120, posts: 450, comments: 980 };
for (const [key, value] of Object.entries(stats)) {
console.log(key, value);
}entries provides key-value pairs for readable iteration.
Use structured clone approaches for deep copy needs.
Use immutable update style to avoid side effects.
Use optional chaining and fallback values for uncertain data structures.
Use dot for static keys, bracket for dynamic keys or invalid identifier names.
No, spread is shallow at top level only.
Use Object.keys, Object.values, or Object.entries based on what you need.
Use Object.freeze when you need to prevent top-level mutation in strict scenarios.