JavaScript開発において、配列から重複要素を削除する処理は頻繁に求められます。ここでは、様々な手法で配列の重複を除去する方法を紹介します：
- 二重ループを使用して重複要素を削除する方法
const data = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5,5];
console.log(data); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5, 5]
function removeDuplicates1(sourceArray) {
for(let i = 0; i < sourceArray.length-1; i++){
for(let j = i+1; j < sourceArray.length; j++){
if(sourceArray[i] === sourceArray[j]){
sourceArray.splice(j,1);
j--;
}
}
}
return sourceArray;
}
const uniqueData = removeDuplicates1(data);
console.log(uniqueData); //[1, 23, 3, 5, 6, 7, 9, 8]
- indexOf()メソッドを活用した重複要素の検出と削除
const elements = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5];
console.log(elements); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5]
function removeDuplicates2(inputArray) {
for (let i = 0; i < inputArray.length; i++) {
if (inputArray.indexOf(inputArray[i]) !== i) {
inputArray.splice(i,1);
i--;
}
}
return inputArray;
}
const uniqueElements = removeDuplicates2(elements);
console.log(uniqueElements); //[1, 23, 3, 5, 6, 7, 9, 8]
- filterメソッドを使用した重複要素の除去
const fruits = ['apple','banana','pear','apple','orange','orange'];
console.log(fruits) //["apple", "banana", "pear", "apple", "orange", "orange"]
const uniqueFruits = fruits.filter((item, index, self) => {
return self.indexOf(item) === index;
});
console.log(uniqueFruits); //["apple", "banana", "pear", "orange"]
- 新しい配列を作成し、indexOfメソッドで重複をチェックする方法
const numbers = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5];
console.log(numbers) //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5]
function removeDuplicates4(originalArray) {
const result = [];
for (let i = 0; i < originalArray.length; i++) {
if (originalArray.indexOf(originalArray[i]) === i) {
result.push(originalArray[i]);
}
}
return result;
}
const uniqueNumbers = removeDuplicates4(numbers);
console.log(uniqueNumbers); //[1, 23, 3, 5, 6, 7, 9, 8]
- オブジェクトを使用して既存要素を追跡する方法
const values = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
console.log(values) //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
const tracker = {};
const uniqueValues = [];
for(let i=0; i<values.length; i++){
if(!tracker[values[i]]){
tracker[values[i]] = true;
uniqueValues.push(values[i]);
}
}
console.log(uniqueValues); //[1, 23, 3, 5, 6, 7, 9, 8]
- 新しい配列に要素が存在するかをチェックして追加する方法
const items = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
console.log(items); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
function removeDuplicates6(sourceItems){
const resultItems = [];
for(let i = 0; i < sourceItems.length; i++){
if(resultItems.indexOf(sourceItems[i]) === -1){
resultItems.push(sourceItems[i]);
}
}
return resultItems;
}
const uniqueItems = removeDuplicates6(items);
console.log(uniqueItems); //[1, 23, 3, 5, 6, 7, 9, 8]
- 配列をソートして隣接要素を比較する方法
const sequence = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
console.log(sequence); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
function removeDuplicates7(inputSequence) {
const result = [];
let previousElement;
inputSequence.sort();
previousElement = inputSequence[0];
result.push(inputSequence[0]);
for (let i = 1; i < inputSequence.length; i++) {
if (inputSequence[i] !== previousElement) {
result.push(inputSequence[i]);
previousElement = inputSequence[i];
}
}
return result;
}
const uniqueSequence = removeDuplicates7(sequence);
console.log(uniqueSequence); //[1, 23, 3, 5, 6, 7, 8, 9]
- 元の配列を直接変更し、ソートして重複を削除する方法
const arrayData = [1,23,1,1,1,3,23,5,6,7,9,9,8,5];
console.log(arrayData); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5]
function removeDuplicates8(targetArray) {
let previousElement;
targetArray.sort();
previousElement = targetArray[0];
for (let i = 1; i < targetArray.length; i++) {
if (targetArray[i] === previousElement) {
targetArray.splice(i,1);
i--;
} else {
previousElement = targetArray[i];
}
}
return targetArray;
}
const uniqueArrayData = removeDuplicates8(arrayData);
console.log(uniqueArrayData); //[1, 23, 3, 5, 6, 7, 8, 9]
- 二重ループを使用して元の配列を変更する方法
const dataSet = [1,1,2,2,3,3,4,4,5,5,4,3,1,2,6,6,6,6];
console.log(dataSet); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 1, 2, 6, 6, 6, 6]
function removeDuplicates9(sourceData){
for (let i = 0; i < sourceData.length; i++) {
for (let j = 0; j < sourceData.length; j++) {
if (sourceData[i] === sourceData[j] && i !== j) {
sourceData.splice(j, 1);
}
}
}
return sourceData;
}
const uniqueDataSet = removeDuplicates9(dataSet);
console.log(uniqueDataSet); //[1, 2, 3, 4, 5, 6]
- 重複要素のインデックスを追跡して新しい配列を作成する方法
const sampleArray = [1,1,2,2,3,3,4,4,5,5,4,3,2,1,1,1];
console.log(sampleArray); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 2, 1, 1, 1]
const resultArray = [];
for (let i = 0; i < sampleArray.length; i++) {
const duplicateIndices = [];
for (let j = i + 1; j < sampleArray.length; j++) {
if (sampleArray[i] === sampleArray[j]) {
duplicateIndices.push(j);
}
}
if (duplicateIndices.length === 0) {
resultArray.push(sampleArray[i]);
}
}
console.log(resultArray); //[5, 4, 3, 2, 1]
- ES6のSetオブジェクトを利用した重複削除
const originalArray = [1,1,2,2,3,3,4,4,5,5,4,3,2,1,1,1];
console.log(originalArray); //[1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 2, 1, 1, 1]
function removeDuplicates11(inputArray){
const uniqueArray = [];
const uniqueSet = new Set(inputArray); // Setは重複を許容しないデータ構造
for(const value of uniqueSet){
uniqueArray.push(value);
}
return uniqueArray;
}
const finalArray = removeDuplicates11(originalArray);
console.log(finalArray); //[1, 2, 3, 4, 5]