js数组去重,将字符串push进数组，合并两个(三个)数组生成合并后的key：value数组

首先，先看一下我项目中需要实现的功能，大概如下图所示：

 实现:

1.反选

/**
* 页面一加载进来的时候，设置勾选过的默认选中
* */
var liEdit = $("#whiteList ul>li>.outInputVal");//列表value值
var whiteSelect = $("#blackSearchList ul>li>.inputVal");//弹出来的选择框value值
if (liEdit.length > 0){
   for (var i = 0;i<liEdit.length;i++){
       if (whiteSelect.length > 0 ){
           for (var j = 0;j<whiteSelect.length;j++){
               // console.log('load11',whiteSelect[j].value);
               if(liEdit[i].value == whiteSelect[j].value){
                    // console.log('相等',whiteSelect[j].previousSibling.value);
                    whiteSelect[j].previousSibling.checked = true;
               }
            }
         }
    }
}

 2.去重，勾选的结果push到一维数组中，多个一维数组转成key:value的二维数组

var arr =$("#blackSearchList ul li");//弹出框选择列表
var outInputVal = $(".outInputVal");//选择后要显示的列表
var obName = [];//数组名称
var obId = [];//数组id
for(var i=0;i<arr.length;i++){//弹出框选择列表选中的和选择后要显示的列表中的值进行去重操作
    var status= arr.eq(i).children().eq(0).is(":checked");
    var flag = true;
    if (status){
       var id= arr.eq(i).children().eq(0).val();
       var name=arr.eq(i).children().eq(1).val();
       for(var j=0;j<outInputVal.length;j++){
           if(name==outInputVal[j].value){
               flag=false;
               break;
           }
        }
        if (flag){
           obName.push(name);//去重后的name和id值
           obId.push(id);
        }
    }
}
var whiteArr = [];//将一维数组转换成二维数组对象
for (var i = 0;i<obName.length;i++){//将一维数组转换成二维数组对象
    var whiteObject = {};
    for (var j = 0;j<obId.length;j++){
        if (i == j){
            whiteObject.name = obName[i];
            whiteObject.id = obId[j];
            whiteArr.push(whiteObject);
         }
    }
}
// console.log('whiteArr',whiteArr);
//遍历二维数组对象，将对应结果加到标签里（将重复的值过滤掉后，在添加到标签中去，这样就不用判断重复了）
for (var m = 0;m<whiteArr.length;m++){
     var liStr ='<li><input type="text" hidden onmouseover="this.title = this.value" value="'+whiteArr[m].id+'">' +
                '<input type="text" class="outInputVal" readonly onmouseover="this.title = this.value" value="'+whiteArr[m].name+'">' +
                '<span class="glyphicon glyphicon-remove removeTrigger"  onclick="removeList(this)" style="cursor: pointer;float: right;margin-top: 5px;margin-right: 9px;"></span> </li>'
      $("#blackList>div>ul").append(liStr);                      
}

 3.上面代码中有个合并两个数组生成合并后的key：value数组，那么在加一个合并三个数组生成合并后的key：value数组

var obName = ['小孩','小明','小哥'];
var obId = ['1','2','3'];
var obValue = ['001','002','003'];
var safeArr = [];
for (var i = 0;i<obName.length;i++){
    var safeObject = {};
    for (var j = 0;j<obId.length;j++){
        for (var k = 0;k<obValue.length;k++){
            if(i == j && i == k){
               safeObject.name = obName[i];
               safeObject.id = obId[j];
               safeObject.value = obValue[k];
               safeArr.push(safeObject);
            }
        }
    }
}
// console.log('safeArr',safeArr);