配列から重複を除く
JavaScriptの配列から重複した値を除いて一意にする方法の説明です。
Setは同じ値を持たないコレクションなのでそれを利用すると次のように簡単に記述できます。
const array = [3, 1, 2, 3, 2, 'a', 'b', 'a'];
const uniqueArray = [...new Set(array)]; // [3, 1, 2, "a", "b"]
スプレッド構文を使わないで、Array.fromをSetのインスタンスに適用しても配列が得られます。
const array = [3, 1, 2, 3, 2, 'a', 'b', 'a'];
const uniqueArray = Array.from(new Set(array)); // [3, 1, 2, "a", "b"]
Setを使わないで自前で地道にやることも可能です。 フィルタを使って重複している要素のみの配列、重複を除外した配列等を構成します。
const array = [3, 1, 2, 3, 2, 'a', 'b', 'a'];
// 重複を除去した一意の値だけの配列
// indexOfは指定した値が最初に見つかったインデックスを返すのでそれと一致した要素だけを抽出する
let uniqueArray = array.filter((item, index, arr) => arr.indexOf(item) === index);
console.log(uniqueArray); // [3, 1, 2, "a", "b"]
// 重複している要素が元々存在していなかった要素だけの配列
// 指定した値の最初と最後のインデックスが同じなら値は一つしかない
var oneValueArray = array.filter((item, index, arr) => arr.indexOf(item) === arr.lastIndexOf(item));
console.log(oneValueArray); // [1, "b"]
// 重複していた要素の配列
// 指定した値の最初と最後のインデックスが異なる場合複数の値が存在している。最初の要素だけをピックアップする。
var dupliacateValueArray = array.filter((item, index, arr) => arr.indexOf(item) !== arr.lastIndexOf(item) && arr.indexOf(item) === index);
console.log(dupliacateValueArray); // [3, 2, "a"]