Question: I have created an object and assigned it to 3 variables like so

```
var barChartOptions, longChartOptions, scatterOptions;
barChartOptions = longChartOptions = scatterOptions = {
    legend: {
        display: false
    },
    scales: {
        ...
    }
};

```

also tried

```
var barChartOption = longChartOptions = scatterOptions = {
    legend: {
        display: false
    },
    scales: {
        ...
    }
};

```

Then I tried to add a key to one of the variables. This key is only specific to this one variable and rest of the object is same for all the variables.

```
longChartOptions.aspectRatio = 3;

```

Now, all three variables have the key `aspectRatio`. Why is this happening? I understand if I define the three variables seperately the problem will not occur but the object is quite long and I wanna keep the code DRY.

Answer: 
Make a function that returns the object, and call that function when defining each variable:

```
const makeOptions = () => ({
  legend: {
    display: false
  },
  scales: {
    // ...
  }
});
const barChartOptions = makeOptions(),
      longChartOptions = makeOptions(),
      scatterOptions = makeOptions();

```

> 
> Why is this happening?
> 
> 
> 

Because assignments resolve to the assigned value. Your original code:

```
barChartOptions = longChartOptions = scatterOptions = { /* ... */ };

```

is equivalent to:

```
scatterOptions = { /* ... */ };
longChartOptions = scatterOptions; // references same object
barChartOptions = longChartOptions; // references same object
// so in the end, scatterOptions === barChartOptions

```

Each variable name references the same object in memory. No cloning of the structure occurs when you assign the same object to a different variable name.
The problem is all the variables are pointing to the same memory block. You can use es6 spread operator which will create different instances.

```
var barChartOptions, longChartOptions, scatterOptions;
{...barChartOptions} = {...longChartOptions} = {...scatterOptions} = {
    legend: {
        display: false
    },
    scales: {
        ...
    }
};

```