DEV Community

Alhiane Lahcen
Alhiane Lahcen

Posted on

2 2

Object Destructuring Javascript ES6

// Example 1
// bind variables to different "car1" object properties

const car1 = {
  name: "fiat",
  model: 500,
  weight: 850,
  color: "red"
};


const { name, color, weight } = car1;

Enter fullscreen mode Exit fullscreen mode

// Example 2
// destruct an object property from a variable
// Rename a variable
// set a value to a variable

const car2 = {
  brand: "fiat",
  model: 500,
  weight: 850,
  colors: {
    red: true,
    green: false
  }
};
Enter fullscreen mode Exit fullscreen mode

// Use ":" sign" to change the name of the variable
// Use the "=" sign to assign a value to a variable

const {
  colors: { red: redColor, white: whiteColor = false, brown = "true" }
} = car2;
Enter fullscreen mode Exit fullscreen mode

Top comments (2)

Collapse
 
aminnairi profile image
Amin

Hi there!

Did you know that you can format your JavaScript code in Markdown? Check out the documentation here for more informations.

I think that a better styling is more appealing to the eyes and can really make your article stand out.

Thank you!

Collapse
 
alhiane profile image
Alhiane Lahcen

this way it will be better
thank you!

SurveyJS custom survey software

JavaScript Form Builder UI Component

Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay