logo

JavaScript 配列内のすべての一意の値を取得 (重複を削除) するにはどうすればよいですか?

JavaScript 配列内のすべての一意の値を取得する (重複を削除する) 方法を学びます。さまざまな値を持つ配列が与えられた場合、私たちの目的は重複をフィルターで除外し、結果の配列をコンソールに表示することです。

JavaScript 内の固有の値を取得する

JavaScript 配列内のすべての一意の値を取得 (重複を削除)



次の方法で、JavaScript 配列内のすべての一意の値を取得できます。

ラテックスフォントサイズ

目次

方法 1: for ループの使用

for ループ メソッドは、元の配列 (listArray) の各値を、重複した値が削除された出力配列 (outputArray) の各値と照合します。現在の値が一意の値を持つ出力配列に存在しない場合は、要素を出力配列に追加します。



例: この例では、文字列値の一意の配列を生成します。

JavaScript
// Creating a 3x4 two-dimensional array let Arr = [  'Manish', 'Chandan', 'Piyush',  'Sunil', 'Pankaj', 'Piyush',  'Pankaj', 'Tiny', 'Chandan',  'Manish']; let outputArray = []; // Count variable is used to add the // new unique value only once in the // outputArray. let count = 0; // Start variable is used to set true // if a repeated duplicate value is // encontered in the output array. let start = false; for (let j = 0; j < Arr.length; j++) {  for (let k = 0; k < outputArray.length; k++) {  if (Arr[j] == outputArray[k]) {  start = true;  }  }  count++;  if (count == 1 && start == false) {  outputArray.push(Arr[j]);  }  start = false;  count = 0; } console.log(outputArray);>

出力
[ 'Manish', 'Chandan', 'Piyush', 'Sunil', 'Pankaj', 'Tiny' ]>

方法 2: Array filter() メソッドを使用する:

arr.filter() 関数は、引数関数で設定された条件を満たす、指定された配列の要素のみで構成される既存の配列から新しい配列を作成するために使用されます。

例: この例では、配列を使用します フィルター() 配列から重複を削除するメソッド。



JavaScript
let Arr = [  'g', 'e', 'e', 'k', 's',   'f', 'o', 'r', 'g', 'e',   'e', 'k', 's' ]; let outputArray = []; function removewithfilter(arr) {  let outputArray = arr.filter(function (v, i, self) {  // It returns the index of the first  // instance of each value  return i == self.indexOf(v);  });  return outputArray; } console.log(removewithfilter(Arr));>

出力
[ 'g', 'e', 'k', 's', 'f', 'o', 'r' ]>

方法 3: set() メソッドを使用する

セットは一意の項目のコレクションです。つまり、どの要素も繰り返すことができません。 ES6 のセットは順序付けされています。セットの要素は挿入順序で反復できます。このセットには、プリミティブであってもオブジェクトであっても、あらゆるタイプの値を格納できます。

例: この例では、 set() メソッド 配列から重複を削除します。

JavaScript
let Arr = [  'DS', 'Algo', 'OS', 'HTML', 'DS',  'OS', 'Java', 'HTML', 'Algo' ]; let outputArray = []; function removeusingSet(arr) {  let outputArray = Array.from(new Set(arr))  return outputArray } console.log(removeusingSet(Arr));>

出力
[ 'DS', 'Algo', 'OS', 'HTML', 'Java' ]>

方法 4:reduce() メソッドを使用する

reduce() メソッド は、配列の要素を削減し、渡したリデューサ関数に基づいてそれらを最終的な配列に結合するために使用されます。

例: この例では、reduce() メソッドの使用方法を見ていきます。

JavaScript
let arr = ['apple', 'mango',  'apple', 'orange', 'mango', 'mango'];   function removeDuplicates(arr) {  let unique = arr.reduce(function (acc, curr) {  if (!acc.includes(curr))  acc.push(curr);  return acc;  }, []);  return unique; } console.log(removeDuplicates(arr));>

出力
[ 'apple', 'mango', 'orange' ]>

方法 5: forEach() メソッドの使用

を使用することで、 forEach() メソッド 、配列内の要素を反復処理でき、配列内に新しい配列が存在しない場合は新しい配列にプッシュします。

例: この例では、forEach() メソッドの使用方法を見ていきます。

コンピューターネットワーク
JavaScript
let arr = ['apple', 'mango',  'apple', 'orange', 'mango', 'mango']; function removeDuplicates(arr) {  let unique = [];  arr.forEach(element =>{ if (!unique.includes(要素)) { unique.push(要素);  } });  一意を返します。 console.log(removeDuplicates(arr));>>

出力
[ 'apple', 'mango', 'orange' ]>

方法 6: IndexOf() メソッドの使用

IndexOf() メソッド 配列要素の最初の出現インデックスを見つけるために使用されます。配列内の要素を反復処理でき、結果の配列に新しい配列が存在しない場合は、新しい配列にプッシュします。

例: この例では、indexOf() メソッドの使用方法を見ていきます。

JavaScript
let arr = ['apple', 'mango',  'apple', 'orange', 'mango', 'mango']; function removeDuplicates(arr) {  let unique = [];  for (i = 0; i < arr.length; i++) {  if (unique.indexOf(arr[i]) === -1) {  unique.push(arr[i]);  }  }  return unique; } console.log(removeDuplicates(arr));>

出力
[ 'apple', 'mango', 'orange' ]>

方法 7: Underscore.js _.uniq() 関数の使用

次のようなサードパーティのライブラリを使用することもできます。 ロダッシュ または アンダースコア.js から重複要素を削除するには JavaScript配列 。の _.uniq() 関数 重複した要素を含まない配列を返します。

例: この例では、_.uniq() 関数を使用します。

JavaScript
const _ = require('underscore'); console.log( _.uniq([1, 2, 3, 4, 5, 4, 3, 2, 1]));>

出力:

[ 1, 2, 3, 4, 5 ]>