vue從獲取到的對象數組中去掉重復數據，重復數據只保留一個

下拉框中的數據是從后台獲取到的數據，將后台傳來的重復數據只保留一個

<el-select
                  filterable
                  placeholder="請選擇品規"
                  v-model="queryObj.production"
                  style="width:150px"
                >
                  <el-option
                    v-for="item in productionObj"
                    :key="item.productId"
                    :label="item.productDesc"
                    :value="item.productId"
                  >
                  </el-option>
                </el-select>

export default {
  data () {
    return {
      queryObj: {
        company: '', //工業公司
      }
    }
  },
  methods: {
    unique(arr) {
      const res = new Map();
      return arr.filter((arr) => !res.has(arr.supplierCode) && res.set(arr.supplierCode, 1));
    },
    // 獲取工業公司
    handleQuaryCompany() {
      const _this = this
      findSupplierInfo().then(req => {
        _this.companyObjAll = req.data
        this.companyObj = this.unique(_this.companyObjAll)
      })
    }
  }
}

jQuery遍歷-has()方法將匹配元素集合縮減為擁有匹配指定選擇器或DOM元素的后代的子集。

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

今天偶然看到數組去重：

1. 利用ES6 Set去重（ES6中最常用）

function unique (arr) {
  return Array.from(new Set(arr))
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
console.log(unique(arr))
 //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {}, {}]

不考慮兼容性，這種去重的方法代碼最少。這種方法還無法去掉“{}”空對象，后面的高階方法會添加去掉重復“{}”的方法。

簡化代碼：

[...new Set(arr)] 

2.利用for嵌套for，然后splice去重（ES5中最常用）

function unique(arr){            
        for(var i=0; i<arr.length; i++){
            for(var j=i+1; j<arr.length; j++){
                if(arr[i]==arr[j]){         //第一個等同於第二個，splice方法刪除第二個
                    arr.splice(j,1);
                    j--;
                }
            }
        }
return arr;
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    //[1, "true", 15, false, undefined, NaN, NaN, "NaN", "a", {…}, {…}]     //NaN和{}沒有去重，兩個null直接消失了

雙層循環，外層循環元素，內層循環時比較值。值相同時，則刪去這個值。

3.利用indexOf去重

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var array = [];
    for (var i = 0; i < arr.length; i++) {
        if (array .indexOf(arr[i]) === -1) {
            array .push(arr[i])
        }
    }
    return array;
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
console.log(unique(arr))
   // [1, "true", true, 15, false, undefined, null, NaN, NaN, "NaN", 0, "a", {…}, {…}]  //NaN、{}沒有去重

新建一個空的結果數組，for 循環原數組，判斷結果數組是否存在當前元素，如果有相同的值則跳過，不相同則push進數組。

 4. 利用filter

function unique(arr) {
  return arr.filter(function(item, index, arr) {
    //當前元素，在原始數組中的第一個索引==當前索引值，否則返回當前元素
    return arr.indexOf(item, 0) === index;
  });
}
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
        console.log(unique(arr))
//[1, "true", true, 15, false, undefined, null, "NaN", 0, "a", {…}, {…}]