# Push and update object using destructuring

If you have an object like this :

```javascript
const default_object = {
    vehicle: 'car',
    color: 'red',
    make: 'Honda',
};
```

and want to update the `color` then we would simply do `default_object.color = 'green'`

Let's say we have an array of objects like this :

```javascript
const objects = [];
```

and we push as in `objects.push(default_object);`

But what if you wanted to add the `default_object` and at the same time update the `color` of the newly pushed object? This is what is done to update the `color` attribute.

```javascript
objects.push({ ...default_object, color: 'green' });
```

This is equivalent to this writing like this :

```javascript
objects.push({ vehicle: 'car', color: 'red', make: 'Honda', color: 'green' });
```

Adding `color` attribute twice only overwrites the first added `color`. So green gets assigned to the `color` value.

In `objects.push({ ...default_object, color: 'green' });` , `...default_object` is *destructured*, meaning it's "expanded" to **vehicle: 'car', color: 'red', make: 'Honda'** and then **color: 'green'** is added to the object overwriting **color: 'red'** in the expansion.

```javascript
const objects = [];

const default_object = {
    vehicle: 'car',
    color: 'red',
    make: 'Honda',
};

console.log(objects);

objects.push(default_object);

console.log(objects);

objects.push({ vehicle: 'car', color: 'red', make: 'Honda', color: 'green' });

objects.push({ ...default_object, color: 'blue' });

console.log(objects);
```