Array element comparison with Json response in Javascript

Question

I have a Json response which looks like this.

[
  {
    "name": "name1",
    "id": "1"
  },
  {
    "name": "name2",
    "id": "2"
  },
  {
    "name": "name4",
    "id": "4"
  },
  {
    "name": "name5",
    "id": "5"    
  }
]

I have another array called "a" which has only id [1,2,3,4,5]. Now i have to compare every element in the array with json response object id. For example, the first element of array "a" exists in json response object , then its respective name should be retrieved and stored in another new array called "b" -> [name1]. The second element of array "a" exists in json response object , then its respective name should be retrieved and appended in "b" array -> [name1,name2]. The third element of array "a" does not exists in json response object , hence no name. In this case, Instead of name, "0" should be appedned in b array for that id -> [name1,name2,0]. The fourth element of array "a" exists in json response object , then its respective name should be retrieved and appended in b array -> [name1,name2,0,name4]. The fifth element of array "a" exists in json response object , then its respective name should be retrieved and appended in b array -> [name1,name2,0,name4,name5].

I tried to implement this by the following code. But instead of [name1,name2,0,name4,name5] , I am getting [name1,name2,name4,name5,0]

for (var i = 0; i < a.length; i++) {
    if (a.includes(jsonResponse[i].id)) {
        b.push(jsonResponse[i].name);
    }
    else{
       b.push("0"); 
   }
}

Answer 1

You need to search for each element of b in the entire jsonResponse array, not just test the current index of jsonResponse.

Use .find() to find the element with the ID you're looking for.

let jsonResponse = [{
    "name": "name1",
    "id": "1"
  },
  {
    "name": "name2",
    "id": "2"
  },
  {
    "name": "name4",
    "id": "4"
  },
  {
    "name": "name5",
    "id": "5"
  }
];

let a = [1, 2, 3, 4, 5];

let b = a.map(id => {
  let found = jsonResponse.find(u => u.id == id);
  return found ? found.name : "0";
});

console.log(b);

Answer 2

You can use Map collection to have O(1) while accessing to the desired element when you map your elements:

let mapResponse = new Map(jsonResponse.map(s=> [+s.id, s.name]));
const result = a.map(id => mapResponse.get(id) || '0')

An example:

let jsonResponse = [
    {
        "name": "name1",
        "id": "1"
    },
    {
        "name": "name2",
        "id": "2"
    },
    {
        "name": "name4",
        "id": "4"
    },
    {
        "name": "name5",
        "id": "5"
    }
];
let a = [1, 2, 3, 4, 5];

let mapResponse = new Map(jsonResponse.map(s=> [+s.id, s.name]));
const result = a.map(id => mapResponse.get(id) || '0')

console.log(result);