使用 JavaScript 从包含图像数据的数组中删除重复值

javascriptweb developmentfront end technologyobject oriented programming更新于 2024/1/7 6:04:17

假设,我们在数组中有一些关于一些图像的数据,例如 −

const arr = [{
   'image': "jv2bcutaxrms4i_img.png",
   'gallery_image': true
},
{
   'image': "abs.png",
   'gallery_image': true
},
{
   'image': "acd.png",
   'gallery_image': false
},
{
   'image': "jv2bcutaxrms4i_img.png",
   'gallery_image': true
},
{
   'image': "abs.png",
   'gallery_image': true
},
{
   'image': "acd.png",
   'gallery_image': false
}];

我们需要编写一个 JavaScript 函数来接收一个这样的数组。

我们的函数应该从数组中删除具有"image"属性重复值的对象。

示例

其代码为 −

const arr = [{
   'image': "jv2bcutaxrms4i_img.png",
   'gallery_image': true
},
{
   'image': "abs.png",
   'gallery_image': true
},
{
   'image': "acd.png",
   'gallery_image': false
},
{
   'image': "jv2bcutaxrms4i_img.png",
   'gallery_image': true
},
{
   'image': "abs.png",
   'gallery_image': true
},
{
   'image': "acd.png",
   'gallery_image': false
}];
const buildUnique = (arr = []) => {
   const unique = [];
   arr.forEach(obj => {
      let found = false;
      unique.forEach(uniqueObj => {
         if(uniqueObj.image === obj.image) {
            found = true;
         };
      });
      if(!found){
         unique.push(obj);
      };
   });
   return unique;
};
console.log(buildUnique(arr));

输出

控制台中的输出将是 −

[
   { image: 'jv2bcutaxrms4i_img.png', gallery_image: true },
   { image: 'abs.png', gallery_image: true },
   { image: 'acd.png', gallery_image: false }
]

相关文章


有用资源