object overwrite when it add into a array inside the loop

Question

I'm working on a algorithm to Transform the array into object. When the last transformed object is overwrite the previous object inside the array.

This is my code:

let array = [
    [
        ['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']
    ],
    [
        ['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']
    ]
];

function transformEmployeeData(array) {
    let obj = {};
    for(let i in array) {
        for(let j in array[i]) {
            obj[array[i][j][0]] = array[i][j][1];
        }
        array.splice(i,1,obj);
    }
    return array;
}

let run = transformEmployeeData(array);

I'm expected to get this result as output:

[
    {firstName: "Joe", lastName: "Blow", age: 42, role: "clerk"}
    {firstName: "Mary", lastName: "Jenkins", age: 36, role: "manager"}
];

Instead of getting this

[
    {firstName: "Mary", lastName: "Jenkins", age: 36, role: "manager"},
    {firstName: "Mary", lastName: "Jenkins", age: 36, role: "manager"}
];

When I log the the obj, I get the expected result. When I add it into an array it just overwrites the previous result.

See the dupe target. You'll just need to nest the method one level, since you need an array of objects. — Cerbrus, Aug 29 '17 at 08:09

Nina Scholz · Answer 1 · 2017-08-29T08:53:55.520

Basically you use the same object over and over and take the last values, because it keeps the reference.

You could initialize obj for every loop with an empty object.

For the result, you could use a new array, without mutating the original array.

Just another hint, for iterating an array, you may better use the index and count it up, instead of the for ... in syntax: Why is using “for…in” with array iteration a bad idea?.

var array = [
  [
    ['firstName', 'Joe'],
    ['lastName', 'Blow'],
    ['age', 42],
    ['role', 'clerk']
  ],
  [
    ['firstName', 'Mary'],
    ['lastName', 'Jenkins'],
    ['age', 36],
    ['role', 'manager']
  ]
];

function transformEmployeeData(array) {
  var i, j, temp = [];
  for (i = 0; i < array.length; i++) {
    let obj = {};
    for (j = 0; j < array[i].length; j++) {
      obj[array[i][j][0]] = array[i][j][1];
    }
    temp.push(obj);
  }
  return temp;
}
let run = transformEmployeeData(array);

console.log(run);

.as-console-wrapper { max-height: 100% !important; top: 0; }

A concise version with Object.assign and spread syntax ....

const getKeyValueArray = array =>
       array.map(a => Object.assign(...a.map(([k, v]) => ({ [k]: v }))));

var data = [[['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']], [['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]];

console.log(getKeyValueArray(data));

.as-console-wrapper { max-height: 100% !important; top: 0; }

Would it be better to return a new transformed array than modifying the input array parameter and causing side effects? — Lasitha Petthawadu, Aug 29 '17 at 08:17

score 1 · Answer 2 · answered Aug 29 '17 at 08:12

why not replace splice with push into a new array and return the new one instead?

function transformEmployeeData(array)     {
    let returnvalue = [];
  for(let i in array) {
    let obj = {};
    for(let j in array[i]) {
      obj[array[i][j][0]]=array[i][j][1];
    }
    returnvalue.push(obj);
  }
  return returnvalue;
}

hope that helps, also when you are iterating try to avoid manipulating the interated array that changes the length to avoid unexpected results i.e. ’splice, push, etc.’

object overwrite when it add into a array inside the loop

2 Answers2