ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryは重複した値を削除します

jqueryは重複した値を削除します

王林
王林オリジナル
2023-05-12 10:05:361102ブラウズ

Web ページを開発する場合、重複した値を削除する必要がある状況が避けられません。たとえば、ドロップダウン メニューでは、重複するオプションを削除する必要があり、1 つだけが残ります。現時点では、jQuery を使用してこの問題を解決できます。

jQuery は、HTML ドキュメントの走査と操作、イベント処理、アニメーション効果などを簡素化する、高速で簡潔な JavaScript ライブラリです。 jQuery には、重複した値を削除するメソッドなど、便利な関数やメソッドが多数あります。

以下に、重複した値を削除するためによく使用される 2 つの方法を紹介します。

方法 1: 配列の filter() メソッドを使用する

filter()メソッドは一般的に jQuery 配列オブジェクトに使用されます。配列要素をフィルタリングし、フィルタリングされた新しい配列を返すために使用できるメソッドです。

  1. 重複する値を含む配列 arr を作成します

var arr = ['a', 'b', 'c', 'a', 'd', ' c'];

  1. jQuery の grep() メソッドを使用して重複値を削除します

var newArr = jQuery.grep(arr, function (item,index) {

return jQuery.inArray(item, arr) === index;

});

  1. 出力結果の印刷

console.log(newArr); // ['a', 'b', ' c' 、'd']

方法 2: JavaScript の Array.from() メソッドとオブジェクトの設定を使用する

Array.from() メソッドは ES6 の新メソッドであり、クラス配列を次のように変換できます。オブジェクトまたは反復可能オブジェクトは配列オブジェクトに変換されます。同時に、Set オブジェクトも ES6 で新しく追加されました。これは、重複を削除するために使用できる、順序付けされていない一意のコレクションです。

  1. 重複する値を含む配列 arr を作成します

var arr = ['a', 'b', 'c', 'a', 'd', ' c'];

  1. Array.from() メソッドを使用して配列を Set オブジェクトに変換し、次に Set オブジェクトを array

var newArr に変換します。 = Array.from(new Set(arr));

  1. 出力結果の印刷

console.log(newArr); // ['a', 'b' , 'c ', 'd']

概要

上記では、配列内の重複値を削除するためによく使用される 2 つの方法、つまり配列の filter() メソッドを使用する方法を紹介しています。新しい ES6 標準の Array.from() メソッドと Set オブジェクトを使用します。実際の開発では、状況に応じて自分に合った方法を選択して問題を解決できます。

以上がjqueryは重複した値を削除しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。