How to avoid JSON pointer in JavaScript with do not use json.stringify?

Question

I want to copy employee to a new employee and not point to an old employee.
I try to use:

newEmployees.assign([{}].employees); <br>
newEmployees = [{...employees}]; <br>

They are pointing to an old employee.

const employees = [
    {
        "id": "1001",
        "firstname": "Luke",
        "lastname": "Skywalker",
        "company": "Walt Disney",
        "salary": "40000"
    },
    {
        "id": "1002",
        "firstname": "Tony",
        "lastname": "Stark",
        "company": "Marvel",
        "salary": "1000000"
    },
    {
        "id": "1003",
        "firstname": "Somchai",
        "lastname": "Jaidee",
        "company": "Love2work",
        "salary": "20000"
    },
    {
        "id": "1004",
        "firstname": "Monkey D",
        "lastname": "Luffee",
        "company": "One Piece",
        "salary": "9000000"
    }
];

let newEmployees = [{}];
newEmployees[0] = employees[3]; // assign
employees[3]['firstname'] = 'Arhus'; // change old employees
console.log(newEmployees); //firstname: 'Arhus' - shows employees content

Thank you so much.

score 1 · Accepted Answer · edited May 04 '18 at 05:35

Just use spread while assigning the value like this

const employees = [
    {
        "id": "1001",
        "firstname": "Luke",
        "lastname": "Skywalker",
        "company": "Walt Disney",
        "salary": "40000"
    },
    {
        "id": "1002",
        "firstname": "Tony",
        "lastname": "Stark",
        "company": "Marvel",
        "salary": "1000000"
    },
    {
        "id": "1003",
        "firstname": "Somchai",
        "lastname": "Jaidee",
        "company": "Love2work",
        "salary": "20000"
    },
    {
        "id": "1004",
        "firstname": "Monkey D",
        "lastname": "Luffee",
        "company": "One Piece",
        "salary": "9000000"
    }
];

let newEmployees = [{}];
newEmployees[0] = { ...employees[3] };
employees[3]['firstname'] = 'Arhus'; // change employee
console.log(newEmployees); //firstname is still Monkey D

score 0 · Answer 2 · answered May 04 '18 at 05:31

Just use .map and object spread:

const employees = [
    {
        "id": "1001",
        "firstname": "Luke",
        "lastname": "Skywalker",
        "company": "Walt Disney",
        "salary": "40000"
    },
    {
        "id": "1002",
        "firstname": "Tony",
        "lastname": "Stark",
        "company": "Marvel",
        "salary": "1000000"
    },
    {
        "id": "1003",
        "firstname": "Somchai",
        "lastname": "Jaidee",
        "company": "Love2work",
        "salary": "20000"
    },
    {
        "id": "1004",
        "firstname": "Monkey D",
        "lastname": "Luffee",
        "company": "One Piece",
        "salary": "9000000"
    }
];
const newEmployees = employees.map(employee => ({...employee}));
employees[3].firstname = 'Arhus';
console.log(newEmployees[3]);
console.log(employees[3]);

score 0 · Answer 3 · answered May 04 '18 at 05:33

While assigning value you can use Object.assign or Object.clone

Consider the following snippet:

 const employees = [
        {
            "id": "1001",
            "firstname": "Luke",
            "lastname": "Skywalker",
            "company": "Walt Disney",
            "salary": "40000"
        },
        {
            "id": "1002",
            "firstname": "Tony",
            "lastname": "Stark",
            "company": "Marvel",
            "salary": "1000000"
        },
        {
            "id": "1003",
            "firstname": "Somchai",
            "lastname": "Jaidee",
            "company": "Love2work",
            "salary": "20000"
        },
        {
            "id": "1004",
            "firstname": "Monkey D",
            "lastname": "Luffee",
            "company": "One Piece",
            "salary": "9000000"
        }
    ];
    
    let newEmployees = [{}];
    newEmployees[0] = Object.assign({}, employees[3]);
    employees[3]['firstname'] = 'Arhus';
    console.log(newEmployees);

score 0 · Answer 4 · answered May 04 '18 at 05:38

I understand you want to copy the object value and don't want to use stringify. Stringifying the object and parsing it back to JSON is one way, cloning the object is another method and I believe spreading also works.

But if you prefer convenience you may want to take a look at "lodash" library's _.clone and _.clonedeep methods.

Also if you'd like to read more refer :

Lodash .clone and .cloneDeep behaviors

How to copy an object by value, not by reference

How to avoid JSON pointer in JavaScript with do not use json.stringify?

4 Answers4