Hapus duplikat dari larik JavaScript

Programming

oleh Vinci terakhir diubah pada 24 Agustus 2022.

Dalam JavaScript, ada banyak opsi untuk menghapus duplikat. Kita akan melihatnya satu per satu dengan contoh berikut.

Contoh ini menyajikan semua opsi dari solusi yang mudah hingga yang kompleks untuk mencapai tujuan ini. Anda dapat menyimpannya di aset sisi klien umum aplikasi Anda untuk digunakan dalam proyek Anda sendiri.

1) Hapus duplikat menggunakan JavaScript Set

Contoh singkat ini menggunakan kelas JavaScript Set. Kelas ini membuat larik elemen unik.

Jika Anda melewatkan array input dengan elemen duplikat, itu akan menghapus kumpulan duplikat dan mengembalikan array elemen unik.

Contoh cepat

// best and simple solution
// when creating a JavaScript Set, it implicitly removes duplicates
const arrayElements = ['a', 'b', 'c', 'a', 'b', 'd'];
console.log(arrayElements);
let uniqueElements = [...new Set(arrayElements)];
// result array after remove is [ 'a', 'b', 'c', 'd' ]
console.log(uniqueElements);

Hapus duplikat dari larik JavaScript

keluaran


[ 'a', 'b', 'c', 'd' ]

2) Cara tercepat untuk menghapus duplikat dari array

Ini adalah cara tercepat untuk menghapus duplikat dari array.

partikel untuk objek langsung hapusDuplikat() Fungsi kustom mengeksekusi loop di atas array input.

Mendefinisikan sebuah array terlihat[] untuk menunjukkan bahwa elemen telah ditemukan.

Memeriksa apakah sudah disetel di bidang terlihat[] Array ditambahkan ke array unik yang dihasilkan jika tidak selama iterasi.

<html>
<body>
    <h1>Remove Duplicates from Array JavaScript - fastest method</h1>
    <script>
        function removeDuplicates(arrayElements) {
        	var seen = {};
        	var resultArray = [];
        	var length = arrayElements.length;
        	var j = 0;
        	for (var i = 0; i < length; i++) {
        		var element = arrayElements[i];
        		if (seen[element] !== 1) {
        			seen[element] = 1;
        			resultArray[j++] = element;
        		}
        	}
        	return resultArray;
        }
        
        const arrayElements = ['a', 'b', 'c', 'a', 'b', 'd'];
        console.log(arrayElements);
        uniqueElements = removeDuplicates(arrayElements);
        // result array after remove is [ 'a', 'b', 'c', 'd' ]
        console.log(uniqueElements);
	</script>
</body>
</html>

3) Hapus item duplikat dari array menggunakan filter()

Filter JavaScript digunakan dengan fungsi panah untuk membatasi output array. Filter elemen array berdasarkan keunikannya.

Kondisi filter menggunakan JavaScript Indeks() Metode perbandingan Indeks() Selalu mengembalikan indeks elemen pertama. terlepas dari beberapa kemunculannya dalam sebuah array.

Kondisi filter ini membandingkan indeks pertama dengan indeks array asli saat ini. Jika kondisinya cocok, fungsi panah mengembalikan elemen dalam larik keluaran. Lihat artikel ini untuk memfilter array dalam elemen PHP untuk menghilangkan duplikat.

<html>
<body>
    <h1>Remove Duplicates from Array JavaScript using filter()</h1>
    <script>
        const arrayElements = ['a', 'b', 'c', 'a', 'b', 'd'];
        console.log(arrayElements);
        let uniqueElements = arrayElements.filter((element, index) => {
        	return arrayElements.indexOf(element) === index;
        });
        // result array after remove is [ 'a', 'b', 'c', 'd' ]
        console.log(uniqueElements);
    </script>
</body>
</html>

4) Hapus duplikat dari array menggunakan hash JavaScript

Dalam metode ini, pemetaan hashtable JavaScript dibuat berdasarkan tipe data elemen array input. Array mendefinisikan pemetaan objek dari tipe data JavaScript primitif.

Ini menerapkan filter untuk melakukan langkah-langkah berikut.

  1. Mendapatkan tipe data elemen array.
  2. Jika elemen tipe satu didefinisikan di antara larik awal, itu menerapkan kondisi filter.
  3. Kondisi memeriksa apakah tabel hash memiliki entri yang mirip dengan atribut elemen saat ini. Mengembalikan elemen saat ini jika kecocokan ditemukan.
  4. Jika elemen array bukan tipe data primitif, filter akan didasarkan pada JavaScript benda’ Pencarian linier
<html>
<body>
    <h1>Remove Duplicates from Array JavaScript using Hashtables</h1>
    <script>
        // uses hash lookups for JavaScrip primitives and linear search for objects
        function removeDuplicates(arrayElements) {
        	var primitives = {
        		"boolean": {},
        		"number": {},
        		"string": {}
        	}, objects = [];
        
        	return arrayElements
        		.filter(function(element) {
        			var type = typeof element;
        			if (type in primitives)
        				return primitives[type]
        					.hasOwnProperty(element) ? false
        					: (primitives[type][element] = true);
        			else
        				return objects.indexOf(element) >= 0 ? false
        					: objects.push(element);
        		});
        }
        
        const arrayElements = ['a', 'b', 'c', 'a', 'b', 'd'];
        console.log(arrayElements);
        uniqueElements = removeDuplicates(arrayElements);
        // result array after remove is [ 'a', 'b', 'c', 'd' ]
        console.log(uniqueElements);
	</script>
</body>
</html>

5) Hapus duplikat dari array menggunakan include() dan Push()

Metode ini menggunakan forEach() JavaScript untuk mengulangi array input. Mendefinisikan array kosong untuk menyimpan elemen unik Elemen unik[].

Pada setiap iterasi, ia memeriksa apakah Elemen unik[] Array sudah memiliki elemen. Ini menggunakan JavaScript include() untuk melakukan pemeriksaan ini.

sejak termasuk() Fungsi mengembalikan false, lalu mendorong elemen saat ini ke dalam Elemen unik[].

<html>
<body>
    <h1>Remove Duplicates from Array JavaScript using includes()
        and push()</h1>
    <script>
        const arrayElements = ['a', 'b', 'c', 'a', 'b', 'd'];
        console.log(arrayElements);
        let uniqueElements = [];
        
        arrayElements.forEach((element) => {
        	if (!uniqueElements.includes(element)) {
        		uniqueElements.push(element);
        	}
        });
        
        // result array after remove is [ 'a', 'b', 'c', 'd' ]
        console.log(uniqueElements);
    </script>
</body>
</html>

6) Hapus item duplikat dari array menggunakan reduce().

Seperti fungsi filter() JavaScript, fungsi reduce() menerapkan kondisi untuk membatasi larik input.

Fungsi ini memiliki elemen saat ini dan hasil sebelumnya, yang dikembalikan oleh panggilan balik reduce().

Setiap panggilan balik mendorong elemen unik ke dalam array. Array ini digunakan dalam panggilan balik berikutnya untuk menerapkan include() dan Push() untuk menghapus duplikat.

<html>
<body>
    <h1>Remove Duplicates from Array JavaScript using reduce()</h1>
    <script>
        const arrayElements = ['a', 'b', 'c', 'a', 'b', 'd'];
        console.log(arrayElements);
        let uniqueElements = arrayElements.reduce(function(pass,
        	current) {
        	if (!pass.includes(current))
        		pass.push(current);
        	return pass;
        }, []);
        // result array after remove is [ 'a', 'b', 'c', 'd' ]
        console.log(uniqueElements);
	</script>
</body>
</html>

7) Hapus duplikat dari array menggunakan penyortiran javascript

Mengurutkan array input dan menghapus duplikat dengan membandingkan elemen berurutan.

Setelah pengurutan, kondisi fungsi filter memeriksa apakah aliran dan elemen sebelumnya tidak sama. Kemudian, itu memfilter array unik dari duplikat.

<html>
<body>
    <h1>Remove Duplicates from Array JavaScript using Sort</h1>
    <script>
        // sort the JavaScript array, and then 
        // remove each element that's equal to the preceding one
        function removeDuplicates(arrayElements) {
        	return arrayElements.sort().filter(
        		function(element, index, ary) {
        			return !index || element != ary[index - 1];
        		});
        }
        
        const arrayElements = ['a', 'b', 'c', 'a', 'b', 'd'];
        console.log(arrayElements);
        uniqueElements = removeDuplicates(arrayElements);
        // result array after remove is [ 'a', 'b', 'c', 'd' ]
        console.log(uniqueElements);
	</script>
</body>
</html>

Keluaran:

Array(6)
    0: "a"
    1: "b"
    2: "c"
    3: "a"
    4: "b"
    5: "d"
    length: 6
Array(4)
    0: "a"
    1: "b"
    2: "c"
    3: "d"
    length: 4

Unduh

Kembali ke atas


Source link

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan.