ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript配列から重複を削除する4つの方法を詳しく解説

JavaScript配列から重複を削除する4つの方法を詳しく解説

黄舟
リリース: 2017-09-22 10:04:55
オリジナル
1458 人が閲覧しました

配列の重複排除の一般的な要件は、配列を指定し、重複排除メソッドを呼び出し、値のコピーを返すことです。コピーには重複する要素はありません。以下では、Script House のエディターが、JS 配列から重複を削除するためのさまざまな方法を紹介します。それらは非常に優れています。必要な方は、配列の重複排除を参照してください。一般的な要件は、重複排除を呼び出すことです。メソッドを呼び出して value のコピーを返す場合、コピーには重複する要素はありません。一般に、=== 比較によって true を返す 2 つの要素は同じ要素とみなされ、重複を排除する必要があります。したがって、1 と "1" は異なる要素であり、1 と new Number(1) は異なる要素です。 } と {} は異なる要素 (異なる参照) です。 (もちろん、{} と {} を同じ要素としてカウントするという要件がある場合、解決策は異なります)

方法 1

二重ループを使用する

function unique(arr) {
 var res = [];
 for(var i = 0, len = arr.length;i < len; i++) {
  var item = arr[i];
  for(var j = 0, jLen = res.length; j<jLen; j++) {
   if(item == res[j]) break;
  }
  if(j == jLen) res.push(item);
 }
 return res;
}
ログイン後にコピー

方法 2

function unique(arr) {
 var ret = []
 for (var i = 0; i < arr.length; i++) {
 var item = arr[i]
 if (ret.indexOf(item) === -1) {
  ret.push(item)
 }
 }
 return ret
}
ログイン後にコピー

ここでシンタックスシュガーを使用して判断できます

function unique(arr) {
 var res = [];
 for(var i = 0, len = arr.length;i < len; i++) {
  var item = arr[i];
  (res.indexOf(item) === -1) && res.push(item);
 }
 return res;
}
ログイン後にコピー

しかし、それより低いバージョンのブラウザでは、indexOf

var indexOf = [].indexOf ?
 function(arr, item) {
  return arr.indexOf(item)
 } :
 function indexOf(arr, item) {
  for (var i = 0; i < arr.length; i++) {
  if (arr[i] === item) {
   return i
  }
  }
  return -1
 }
function unique(arr) {
 var ret = []
 for (var i = 0; i < arr.length; i++) {
 var item = arr[i]
 if (indexOf(ret, item) === -1) {
  ret.push(item)
 }
 }
 return ret
}
ログイン後にコピー

method3 を使用してください二重ループの別の種類 比較方法は、元の配列の要素と結果の配列を 1 つずつ比較することです。次に、元の配列の繰り返し要素の最後の要素を配列に入れることができます

function unique(arr) {
 var ret = [];
 var len = arr.length;
 var isRepeat;
 for(var i=0; i<len; i++) {
  isRepeat = false;
  for(var j=i+1; j<len; j++) {
   if(arr[i] === arr[j]){
    isRepeat = true;
    break;
   }
  }
  if(!isRepeat){
   ret.push(arr[i]);
  }
 }
 return ret;
}
ログイン後にコピー

。こちらにも最適化版があります

function unique(a) {
 var res = [];
 for (var i = 0, len = a.length; i < len; i++) {
 for (var j = i + 1; j < len; j++) {
  // 这一步十分巧妙
  // 如果发现相同元素
  // 则 i 自增进入下一个循环比较
  if (a[i] === a[j])
  j = ++i; //j = i = i + 1;
 }
 res.push(a[i]);
 }
 return res;
}
ログイン後にコピー

method4JavaScriptのobjectオブジェクトをハッシュテーブルとして使用します

function dedup(arr) {
 var hashTable = {};
 return arr.filter(function(value,index,arr){
  var key = JSON.stringify(value);
  var match = Boolean(hashTable[key]);
  return (match ? false : hashTable[key] = true);
 });
}
ログイン後にコピー

Objectのキー値は全てString型なのでなので、1 と "1" は区別できませんが、区別できます。 わずかな改善により、型もキーに保存されるようになりました

function dedup(arr) {
 var ret = [];
 var hash = {};
 for(var i = 0; i < arr.length; i++) {
  var item = arr[i];
  var key = typeof(item) + item;
  if(hash[key] !== 1) {
   ret.push(item)
   hash[key] = 1;
  }
 }
 return ret;
}
ログイン後にコピー

概要

以上がJavaScript配列から重複を削除する4つの方法を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート