群里閑聊,聊到了這個問題,有大佬回答,特此記錄學習;
先說一下問題:

兩種方式:一種是使用ES6的寫法,逼格高大上:
let a=[1,2,3,4], b=[1,2,3,5,4,6],
c = [...a, ...b],
d = new Set(c),
e = Array.from(d),
f = [...e.filter(_=>!a.includes(_)),...e.filter(_=>!b.includes(_))];
console.log(f);//[5, 6]
我知道ES6已經流行開了,但對我來說還是某些查了資料才看明白,菜啊!
首先,其中的 "..." ,三個點也就是省略號是是ES對數組新添加的方法,學名叫做擴展運算符,他的主要作用有
復
制數
組、
合並數組、
與解構賦值結合、
字符串轉數組、
實現了 Iterator 接口的對象、
Map 和 Set 結構,Generator 函數(點擊查看阮一峰老師的講解),
這里用到的就是數組的合並,將其合並為一個數組。
然后,d的作用,轉化為一個set,set是ES6提供的一種數據結構,這里主要用到是它不包含重復元素的特點,這樣轉化成了一個沒有重復元素的數據結構(不敢說成集合和數組),數組去重so easy!
再然后,e變量作用簡單明了,把d的這種類數組數據結構轉化為數組,數組中包含的仍是兩個數組的並集
再然后,f變量里面東西就多點了,首先是includes方法。看名稱應該知道是包含的意思,這個就是a包含這個元素則返回true,否則返回false,數組的filter方法在接受到includes函數的結果取反之后,就篩選除了e中不包含a的元素,再加上e中不包含b的元素,重新組成一個數組,這個數組就是最后的結果;
我嘗試用韋恩圖(就是交集、並集、取反那一堆)的方式解釋出來,但是數學太渣了,沒辦法,你們誰數學好的可以私我發過來。。。
第二種方法:(接地氣,兼容性好,支持IE8)
function diff(arr1,arr2){
var a = [];
var b = [];
for(var i=0;i<arr2.length;i++){
a[arr2[i]]=true;
}
for(var i=0;i<arr1.length;i++){
if(!a[arr1[i]]){
b.push(arr1[i]);
}
}
console.log(b)
}
let aa = ["a","b"],bb=["a"];
diff(aa,bb);//"b"
這個方法一看就明白,簡單易懂,並且也是較為穩定的方法,這個不會的就自行谷歌吧。。
<wiz_tmp_tag id="wiz-table-range-border" contenteditable="false" style="display: none;">