# What is object destructuring in JavaScript?

> Learn what object destructuring means in JavaScript and how to extract object properties into named variables, including how to rename a variable as you go.

Author: [Flavio Copes](https://flaviocopes.com/about/) | Published: 2020-06-15 | Topics: [JavaScript](https://flaviocopes.com/tags/js/) | Canonical: https://flaviocopes.com/javascript-object-destructuring/

Say you have an object with some properties:

```js
const person = {
  firstName: 'Tom',
  lastName: 'Cruise',
  actor: true,
  age: 57
}
```

You can extract just some of the object properties and put them into named variables:

```js
const { firstName, age } = person
```

Now we have 2 new variables, `firstName` and `age`, that contain the desired values:

```js
console.log(firstName) // 'Tom'
console.log(age) // 54
```

The value assigned to the variables does not depend on the order we list them, but it's based on the property names.

You can also automatically assign a property to a variable with another name:

```js
const { firstName: name, age } = person
```

Now instead of a variable named `firstName`, like we had in the previous example, we have a `name` variable that holds the `person.firstName` value:

```js
console.log(name) // 'Tom'
```
