Nearby lessons

10 of 22

JavaScript: Destructuring Objects

📌 What is Object Destructuring?

Object destructuring in JavaScript provides a convenient way to extract multiple properties from an object and assign them to variables. It helps to write cleaner and more readable code, especially when working with complex objects.

1️⃣ Basic Object Destructuring

You can extract values from objects and assign them to variables with matching property names.

Example02
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

2️⃣ Using Alias Names

You can assign properties to variables with different names using : in the destructuring pattern.

Example03
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

3️⃣ Assigning Default Values

If a property doesn’t exist in the object, you can assign a default value.

Example04
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

4️⃣ Destructuring in Function Parameters

You can destructure object properties directly in the function parameter list.

Example05
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

5️⃣ Nested Object Destructuring

You can also destructure properties from nested objects.

Example06
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

🧠 Test Your Knowledge

3 Questions
Progress: 0 / 3