JavaScript の一意の配列

1. JavaScript の Set() 関数を使用して配列から一意の値を取得する
2. JavaScript の indexOf() 関数を使用して配列から一意の値を取得する
3. JavaScript の filter() 関数を使用して配列から一意の値を取得する

このチュートリアルでは、JavaScript の Set()、indexOf()、および filter() 関数を使用して配列から一意の値を取得する方法について説明します。

JavaScript の Set() 関数を使用して配列から一意の値を取得する

配列から一意の値を取得するには、Set() 関数を使用できます。この関数は、既存の配列から一意の値を使用して新しい配列を作成します。たとえば、重複する値を持つ配列を作成し、Set() 関数を使用して一意の値を持つ新しい配列を作成し、JavaScript の console.log() 関数を使用してコンソールに結果を表示しましょう。以下のコードを参照してください。

var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = [...new Set(myArray)]
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);

出力：

Original Array =  (5) ["c", "b", "c", 2, "b"]
Array with unique values =  (3) ["c", "b", 2]

出力では、新しい配列に重複する値は含まれていません。

JavaScript の indexOf() 関数を使用して配列から一意の値を取得する

配列から一意の値を取得するには、indexOf() 関数とループを使用して独自の関数を作成します。これにより、既存の配列から一意の値を持つ新しい配列が作成されます。配列を使用して要素を新しい配列に移動し、indexOf() 関数を使用して要素が新しい配列にすでに存在するかどうかを確認します。

要素が新しい配列にない場合は、新しい配列に移動されます。そうでなければ、それは残ります。たとえば、重複する値を持つ配列を作成してから、関数を使用して一意の値を持つ新しい配列を作成し、JavaScript の console.log() 関数を使用してコンソールに結果を表示しましょう。以下のコードを参照してください。

function uArray(array) {
  var out = [];
  for (var i = 0, len = array.length; i < len; i++)
    if (out.indexOf(array[i]) === -1) out.push(array[i]);
  return out;
}
var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = uArray(myArray);
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);

出力：

Original Array =  (5) ["c", "b", "c", 2, "b"]
Array with unique values =  (3) ["c", "b", 2]

ここで、新しい配列には重複する値は含まれていません。

JavaScript の filter() 関数を使用して配列から一意の値を取得する

配列から一意の値を取得するには、filter() 関数を使用できます。この関数は、特定の条件に応じて既存の配列から値をフィルター処理することにより、新しい配列を作成します。filter() 関数は、元の配列に存在する各値をチェックします。値が重複している場合、関数はその値を削除します。それ以外の場合、値は新しい配列に追加されます。

たとえば、重複する値を持つ配列を作成し、filter() 関数を使用して一意の値を持つ新しい配列を作成し、JavaScript の console.log() 関数を使用してコンソールに結果を表示しましょう。以下のコードを参照してください。

var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = myArray.filter((val, ind, arr) => arr.indexOf(val) === ind);
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);

出力：

Original Array =  (5) ["c", "b", "c", 2, "b"]
Array with unique values =  (3) ["c", "b", 2]

ここでわかるように、新しい配列には重複する値は含まれていません。