score:0

Accepted answer

you can use array.map() and array.find() like this:

const newcases = this.state.cases.map(({ photo_id, ...rest }) => {
  const obj = { ...rest };
  this.state.photos.find(ph => {
    if(ph.id === photo_id) {
      obj.file = ph.file;
      return true;
    }
  });
  return obj;
});

live example:

const data = {
  "cases": [{
    "id": 3,
    "photo_id": 14
  }, {
    "id": 2,
    "photo_id": 0
  }, {
    "id": 1,
    "photo_id": 13
  }],
  "photos": [{
    "id": 6,
    "file": "\/images\/1556196076cache_f50f03558d201b8eb2a9af90f0838cee.png"
  }, {
    "id": 11,
    "file": "\/images\/1556198414cache_702c216fa5a4d75d74db237ddf97b012.png"
  }, {
    "id": 12,
    "file": "\/images\/1556198946cache_702c216fa5a4d75d74db237ddf97b012.png"
  }, {
    "id": 13,
    "file": "\/images\/1556726055dewekkpot.nl_short.jpg"
  }, {
    "id": 14,
    "file": "\/images\/1556791722dewekkpot.nl_short.jpg"
  }]
};

const newcases = data.cases.map(({ photo_id, ...rest }) => {
  const obj = { ...rest };
  data.photos.find(ph => {
    if(ph.id === photo_id) {
      obj.file = ph.file;
      return true;
    }
  });
  return obj;
});

console.log(newcases);

score:-1

function addphotos(cases, photos){
    return cases.map(function (currentcase) {
            const foundphoto = photos.find(function(currentphoto){
                return currentphoto.id === currentcase.photo_id;
            });
            currentcase.photo_path = foundphoto? foundphoto.file : "/images/blank_image.jpg";
            return currentcase;
    });
};

console.log(addphotos(this.state.cases, this.state.photos));
//output: [{"id":3,"photo_id":14,"photo_path":"/images/1556791722dewekkpot.nl_short.jpg"},{"id":2,"photo_id":0,"photo_path":"images/blank_image.jpg"},{"id":1,"photo_id":13,"photo_path":"/images/1556726055dewekkpot.nl_short.jpg"}]

score:1

normalise your data. convert your photos array to an object with photo_id as keys, for easy access.

you could do something like the following:

addphotos() {
    var photosmap = this.state.photos.reduce(function (acc, each) {
      acc[each.id] = each; // or you could just save the corresponding filename
      return acc;
    }, {});

    var photofiles = this.state.cases.reduce(function (acc, each) { // you could alternatively use array.filter too.
      if (photosmap[each.photo_id]) {
        acc.push(photosmap[each.photo_id]);
      }
      return acc;
    }, []);

    console.log(photofiles);

}

score:1

you can filter the objects as below snippet and use it to render your view.

const obj = {
    "cases": [{
        "id": 3,
        "photo_id": 14
    }, {
        "id": 2,
        "photo_id": 0
    }, {
        "id": 1,
        "photo_id": 13
    }],
    "photos": [{
        "id": 6,
        "file": "\/images\/1556196076cache_f50f03558d201b8eb2a9af90f0838cee.png"
    }, {
        "id": 11,
        "file": "\/images\/1556198414cache_702c216fa5a4d75d74db237ddf97b012.png"
    }, {
        "id": 12,
        "file": "\/images\/1556198946cache_702c216fa5a4d75d74db237ddf97b012.png"
    }, {
        "id": 13,
        "file": "\/images\/1556726055dewekkpot.nl_short.jpg"
    }, {
        "id": 14,
        "file": "\/images\/1556791722dewekkpot.nl_short.jpg"
    }]
};

const photoids = obj.cases.reduce((acc, val) => {
    acc[val.photo_id] = val;
    return acc;
}, {});

const res = obj.photos.filter(val => photoids[val.id]);
console.log(res)


Related Query

More Query from same tag