Js's problem about the deduplication of two associative arrays?

The

scenario is that the user can choose as many times as he or she wants on the add contact page (return to the form page and enter the contact page again), so duplicate data will be generated.
has two arrays to store data. Arr1 sends an array of user identities to the server. Arr2 displays the user"s name on the page.
arr2 cannot be duplicated alone, because there may be duplicate names.
my idea is to de-weight the arr1 array while removing the weight of the arr2 through index.
but don"t know how to write the specific code? I wonder if there is a better way?

arr1userid
["id1","id2","id2","id4"]

arr2,userid
["","","",""]
Mar.13,2021

var obj = {};
arr1.forEach(function(value,key)
{
    if(obj[value] == undefined)
    {
        obj[value] = arr2[key];
    }
});

//Map
var map = new Map()
arr1.forEach(function(value,key){
    map.set(value, arr2[key]);
})
arr1 = Array.from(map.keys())
arr2 = Array.from(map.values())

actually there is something wrong with this structure. You should have an arr3 with object, structure

.
var arr3 = [];
var obj = {
    id:""
    name:""
}
var objmap = new Map();
objmap.set(id,obj);

it's hard to laugh or cry when you read the landlord's comments to others. Is it true that the initial data you got are two arrays? Didn't you open it yourself?

var objArr = [{id:'id1',name:'x'},{id:'id2',name:'y'},
{id:'id3',name:'z'},{id:'id1',name:'x'}];
var myMap = new Map();
objArr.forEach((item)=>{
    myMap.set(item.id,item.name);
})
var arr1 = [...myMap.keys()];
var arr2 = [...myMap.values()];

I think you can start with "how not to generate duplicate data" when you go to the contact person page to add again.

Menu