数组对象添加一一对应的值

最新推荐文章于 2022-03-09 14:51:34 发布

leizi929

最新推荐文章于 2022-03-09 14:51:34 发布

阅读量376

点赞数

CC 4.0 BY-SA版权

分类专栏： javaScript

本文链接：https://blog.csdn.net/leizi929/article/details/117870973

javaScript 专栏收录该内容

5 篇文章

订阅专栏

这段代码展示了如何利用Map对象将指定的图片路径根据name值添加到数组对象中。首先创建了一个Map，键值对对应name和图片名称，然后通过map方法遍历原始数组，获取每个对象的name，从Map中查找对应的图片路径，并添加到对象中形成新的数组。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

let arr = [
        {
          name: 'like',
          content: [
            { userName: '张三', age: '19' },
            { userName: 'zangke', age: '29' }
          ]
        },
        {
          name: 'love',
          content: [
            { userName: '李四', age: '22' },
            { userName: 'like', age: '16' }
          ]
        }
      ]

我想往接口里面根据name的值添加一一对应的图片，怎么实现？
比如like的图片是…/like.png,love的图片是love.png，还有wow的图片…/wow.png
最终想要的结果是这样的
图片的路径是本地固定的，接口返回的没有图片，要根据对应的name添加对应的图片塞进数组里面，在返回新数组，如果匹配不到这个name值，就不管。

 [
        {
          name: 'like',
          img:'../like.png'
          content: [
            { userName: '张三', age: '19' },
            { userName: 'zangke', age: '29' }
          ]
        },
        {
          name: 'love',
          img:'../love.png'
          content: [
            { userName: '李四', age: '22' },
            { userName: 'like', age: '16' }
          ]
        }
      ]

 let m = new Map([['like','like.png'], ['love','love.png'], ['wow','wow.png'], ['haha','haha.png']])
  let newarr =  arr.map((item, index) => {
    let picUrl = m.get(item.name);
    item.image = picUrl;
    return {...item}
  });
      console.log('arr-',newarr);