Trailing and leading commas added issue

I am calling a function from jsx as xyz(id) inside the <img src = "xyz(id)" />. In the calling function, I am retrieving the image value through a map as

const xyz = (id) =>{
     return abc.map(a => {
         if(a.id === id){
             if(a.url){
                 return a.url;
                 }
             }
         })
     }

When I inspect the img element trailing and leading commas are being appended after the return statement as “..returned_url..”.