Question

What i want to accomplish is to map the objects of array to add one more key value pair.

For example:

 var arr = [{ "name": "ABC", "id": 1 }, { "name": "XYZ", "id": 2 }, { "name": "QWE", "id": 3 }]; var arr2 = arr.map( x => x.id_name = x.id + ' - ' + x.name); console.log('arr = ', arr); console.log('arr2 = ',arr2); 

It changes the original array as expected, but returns an array of x.id_name only.

Answer 1

If you want to change original array , use Array.forEach

 let arr = [{"name": "ABC","id": 1},{"name": "XYZ","id": 2},{"name": "QWE","id": 3}]; arr.forEach( x => x.id_name = x.id + ' - ' + x.name); console.log(arr); 

If you want to preserve original array , use Array.map

 let arr = [{"name": "ABC","id": 1},{"name": "XYZ","id": 2},{"name": "QWE","id": 3}]; let arr1 = arr.map(({id,name}) => ({id, name, "id_name" : id + ' - ' + name})); console.log(arr1); // udpated console.log(arr); // same 

Answer 2

You have to return the entire object:

arr.map(x => {
  x.id_name = x.id + ' - ' + x.name
  return x
})

Or more elegant, as this does not modify the original array:

add.map(({id, name}) => ({
  id,
  name,
  id_name: `${id} - ${name}`
}))

Answer 3

With a new property of the same object, you mutate it by assinging a value.

You need a new object without a reference to the old object by using Object.assign and map this object.

 var array = [{ name: "ABC", id: 1 }, { name: "XYZ", id: 2 }, { name: "QWE", id: 3 }], newArray = array.map(o => Object.assign({}, o, { id_name: [o.id, o.name].join(' - ') })); console.log(newArray); console.log(array); 

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

Answer 4

这就是我会做的

arr.map(elem => ({...elem, ['id_name']: `${elem.id}-${elem.name}`}))

Answer 5

var x = arr.map(function(x) { return { name: x.name, test: 'bob' + x.name } });

那应该让你顺利

Answer 6

From your implementation, you told map to return the x.id_name . As with arrow functions, you can return from it in two ways

directly with a single return

array.map(item => single_line_expression)
  // example
  [1,2,3,4].map(n => n*4)
  result :
    [4, 8, 12, 16]

block statements

array.map(item => {
  statements 
  return what_should_be_replace_by_item
})

// example
[1,2,3,4].map(n => {
  const multi = n*4
  return multi
})
result :
 [4, 8, 12, 16]