在 Javascript 中使用 map 函数返回新值答案

【问题标题】：Using map function in Javascript to return new values在 Javascript 中使用 map 函数返回新值
【发布时间】：2018-01-11 07:08:58
【问题描述】：

这是我的 json：

[ { gsm: 'gsm',
  firstName: 'firstname',
  lastName: 'lastname' },
{ gsm: '123456789',
  firstName: 'Mohamed',
  lastName: 'Sameer'},
{ gsm: '987654321',
  firstName: 'Hameed',
  lastName: 'Basha'}]

我希望我的最终输出看起来像：

[ { gsm: 'gsm',
  firstName: 'firstname',
  lastName: 'lastname',
  userKey: 'Key1'},
{ gsm: '123456789',
  firstName: 'Mohamed',
  lastName: 'Sameer',
  userKey: 'Key1'},
{ gsm: '987654321',
  firstName: 'Hameed',
  lastName: 'Basha',
  userKey: 'Key1'}]

我需要使用任何 javascript 方法，如 map...等

【问题讨论】：

Add property to an array of objects的可能重复

标签： javascript arrays json object

【解决方案1】：

使用map

var output = arr.map( s => ( s.userKey = "Key1", s ) );

演示

var arr = [{
    gsm: 'gsm',
    firstName: 'firstname',
    lastName: 'lastname'
  },
  {
    gsm: '123456789',
    firstName: 'Mohamed',
    lastName: 'Sameer'
  },
  {
    gsm: '987654321',
    firstName: 'Hameed',
    lastName: 'Basha'
  }
];

var output = arr.map( s => ( s.userKey = "Key1", s ) );

console.log( output );

【讨论】：

这将改变原始数组arr。
我认为 forEach 在这种情况下更合适arr.forEach( s => s.userKey = "Key1" );。由于数组中没有任何值被更新，只有它们引用的对象是。
@Xufox 如果 OP 不希望原始数组发生突变，那么 Nina 的回答就足够了。我打算做同样的事情，但意识到 Nina 已经做到了。

【解决方案2】：

您可以使用Object.assign 生成对象的副本并分配一个新属性，并使用Array#map 获取一个新数组。

var original = [ { gsm: 'gsm', firstName: 'firstname', lastName: 'lastname' }, { gsm: '123456789', firstName: 'Mohamed', lastName: 'Sameer' }, { gsm: '987654321', firstName: 'Hameed', lastName: 'Basha' }],
    copy = original.map(o => Object.assign({}, o, { key: 'key1' }));
    
console.log(copy);
console.log(original);

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

【讨论】：

【解决方案3】：

如果您不想改变原始数组：

const arr = [ { gsm: 'gsm',
  firstName: 'firstname',
  lastName: 'lastname' },
{ gsm: '123456789',
  firstName: 'Mohamed',
  lastName: 'Sameer'},
{ gsm: '987654321',
  firstName: 'Hameed',
  lastName: 'Basha'}]
  
 const newArr = arr.map(item => ({
   ...item,
   userKey: 'Key1',
 }))
 
 console.log(newArr)

【讨论】：

【解决方案4】：

你可以这样做:)

var data = [ { gsm: 'gsm',
  firstName: 'firstname',
  lastName: 'lastname' },
{ gsm: '123456789',
  firstName: 'Mohamed',
  lastName: 'Sameer'},
{ gsm: '987654321',
  firstName: 'Hameed',
  lastName: 'Basha'}]
  
 var finalarray = data.map(x => (x.userKey = 'Key1', x));
 console.log(finalarray);

【讨论】：

他正在使用 sn-p

【解决方案5】：

data.map(el => Object.assign(el, {userKey: 'Key1'}))

或

data.map(el => ({ ...el, userKey: 'Key1' }))

【讨论】：

感谢您提供此代码 sn-p，它可能会提供一些有限的即时帮助。 proper explanation would greatly improve its long-term value 通过展示为什么这是一个很好的解决问题的方法，并将使其对未来有其他类似问题的读者更有用。请edit您的回答添加一些解释，包括您所做的假设。