如何在map方法中向字典添加键值对

嘿，我来给你捋捋怎么在map方法里给字典（也就是JavaScript里的对象）加新的键值对～ 你看你现在有这么一组用户行为数据：

results = [ 
  { 
    user_name: 'User 1',     
    email: 'user1@email.com',     
    userid: 'HJ10092',     
    event_type: 'download',     
    country: 'Venezuela',     
    doc_type: 'mspowerpoint',     
    total: '1' 
  },   
  { 
    user_name: 'User 1',     
    email: 'user1@email.com',     
    userid: 'HJ10092',     
    event_type: 'download',     
    country: 'Venezuela',     
    doc_type: 'document',     
    total: '1' 
  },   
  { 
    user_name: 'User 1',     
    email: 'user1@email.com',     
    userid: 'HJ10092',     
    event_type: 'view',     
    country: 'Venezuela',     
    doc_type: 'spreadsheet',     
    total: '1' 
  }
];

map方法的核心就是遍历数组里的每个元素，返回一个新的元素，所以要给每个对象加键值对，咱们有两种常见的做法：

方法一：返回全新对象（推荐，不修改原数据） #

这种方式会保留原对象不动，返回一个包含原属性+新属性的新对象，属于不可变操作，能避免意外修改原数据的坑。比如你想给每条记录加一个action_date（操作日期）和is_processed（是否已处理）的标记：

const updatedResults = results.map(item => {
  // 展开原对象的所有属性，再追加新的键值对
  return {
    ...item,
    action_date: '2024-05-20',
    is_processed: true
  };
});

方法二：直接修改原对象（不推荐，会污染原数据） #

如果你确定不需要保留原数据，也可以直接在遍历的时候给原对象添加属性，然后返回它：

const updatedResults = results.map(item => {
  // 直接给原对象新增属性
  item.action_date = '2024-05-20';
  item.is_processed = true;
  return item;
});

⚠️ 注意：这种方法会直接改变原数组里的原始对象，要是之后你还需要用到未修改的原始数据，就会出问题，所以一般优先选第一种方法。

进阶玩法：根据原属性动态添加新值 #

比如你想根据doc_type给每条记录加一个doc_category（文档分类），可以在map里做判断后再添加：

const updatedResults = results.map(item => {
  let doc_category;
  switch(item.doc_type) {
    case 'mspowerpoint':
      doc_category = '演示文稿';
      break;
    case 'document':
      doc_category = '办公文档';
      break;
    case 'spreadsheet':
      doc_category = '电子表格';
      break;
    default:
      doc_category = '其他文档';
  }
  return {
    ...item,
    doc_category
  };
});

这样处理后，每个对象就都多了一个根据文档类型自动分类的属性啦～

怎么样，是不是一下子就明白怎么操作了？map方法的灵活性就体现在这里，只要在遍历过程中返回你想要的新结构就行～

内容来源于stack exchange