Don't change the main object when adding a variable to it in JavaScript [duplicate]

Question

I need to use a variable globally declared, but modify it for the use of a function:

var example = {
    selected: '0',
    list: {
        1: {
            value: '1',
            name: "example 1"
        },
        2: {
            value: '2',
            name: "example 2"
        },
        3: {
            value: '3',
            name: "example 3"
        }
    }
};

window.load(function () {
    var example2 = example;
    example2.info = "newinfo";
    // Use example 2
})

The problem is, after that, if I console.log(example), it contains the "info" variable, absolutely unwanted. I don't even see why it would have it, I purposely defined a new variable to avoid this.

I guess you're looking for prototype developer.mozilla.org/en-US/docs/Web/JavaScript/… — enguerranws
– enguerranws, Commented Nov 10, 2015 at 14:24
view this question for explainantion as to why: stackoverflow.com/questions/518000/… — uesports135
– uesports135, Commented Nov 10, 2015 at 14:26

Nina Scholz · Accepted Answer · 2015-11-10 14:26:55Z

4

The single assignment keeps the reference to the original object. So any changes are reflected to the original object.

Just use JSON.stringify and JSON.parse for a copy.

var example2 = JSON.parse(JSON.stringify(example));

edited Nov 10, 2015 at 14:26

answered Nov 10, 2015 at 14:24

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Don't change the main object when adding a variable to it in JavaScript [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related