Jak uzyskać listę unikatowych wartości w tablicy? Czy zawsze muszę używać drugiej tablicy, czy też jest coś podobnego do hashmap Java w JavaScript?
Mam zamiar używać tylko JavaScript i jQuery . Nie można używać żadnych dodatkowych bibliotek.
javascript
jquery
Astronauta
źródło
źródło
underscore.js
biblioteki?list.toSet
Odpowiedzi:
Skoro pisałem o tym w komentarzach do odpowiedzi @ Rocket, równie dobrze mogę podać przykład, który nie korzysta z bibliotek. Wymaga to dwóch nowych funkcji prototypowych
contains
iunique
Aby uzyskać większą niezawodność, możesz wymienić podkładkę
contains
MDNindexOf
i sprawdzić, czy każdy elementindexOf
jest równy -1: dokumentacjaźródło
~a.indexOf(b) === (a.indexOf(b) == -1)
if (~a.indexOf(b)) ...
jest identyczne z pisaniem dłuższymif (a.indexOf(b) == -1) ...
.Lub dla tych, którzy szukają jednowierszowego (prostego i funkcjonalnego), kompatybilnego z aktualnymi przeglądarkami :
Aktualizacja 18-04-2017
Wygląda na to, że „Array.prototype.includes” jest teraz szeroko obsługiwany w najnowszych wersjach głównych przeglądarek ( zgodność )
Aktualizacja 29-07-2015:
Istnieją plany, aby przeglądarki obsługiwały znormalizowaną metodę „Array.prototype.includes”, która chociaż nie odpowiada bezpośrednio na to pytanie; jest często powiązany.
Stosowanie:
Pollyfill ( obsługa przeglądarek , źródło z Mozilli ):
źródło
Oto znacznie czystsze rozwiązanie dla ES6, którego nie ma tutaj. Używa Set i operatora spreadu :
...
Który powraca
[1, 2]
źródło
Array.from(... new Set(a))
ponieważ Set nie może być niejawnie przekonwertowany na typ tablicy. Tylko jedno ostrzeżenie!Array.from(new Set(a))
? To wydaje się działać.One Liner, czysty JavaScript
Ze składnią ES6
list = list.filter((x, i, a) => a.indexOf(x) === i)
Ze składnią ES5
Zgodność z przeglądarkami : IE9 +
źródło
a.indexOf(x) === i
zanotować trzy znaki równości.Używając EcmaScript 2016 możesz to zrobić w ten sposób.
Zestawy są zawsze unikalne i za pomocą
Array.from()
można przekonwertować zestaw na tablicę. W celach informacyjnych zapoznaj się z dokumentacją.https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects /Zestaw
źródło
indexOf()
odpowiedzi są straszne, ponieważ są O (N ^ 2). Rozłożone odpowiedzi są poprawne, ale nie będą działać w przypadku dużych tablic. To jest najlepsze podejście.Teraz w ES6 możemy korzystać z nowo wprowadzonej funkcji ES6
LUB według składni rozprzestrzeniania tablicy w iterable
Zwróci unikalny wynik.
źródło
new Set
tego typu (np. Nowoczesny Angular / TypeScript)let items = [1,1,1,1,3,4,5,2,23,1,4,4,4,2,2,2];
let uniqueItems = [...new Set(items)];
Jeśli chcesz pozostawić oryginalną tablicę nienaruszoną,
potrzebujesz drugiej tablicy, aby zawierała unikalne elementy pierwszej
Większość przeglądarek ma
Array.prototype.filter
:źródło
W dzisiejszych czasach możesz użyć typu danych Set ES6, aby przekonwertować swoją tablicę na unikalny zestaw. Następnie, jeśli potrzebujesz użyć metod tablicowych, możesz zmienić je z powrotem w Array:
źródło
var uniqueArr = [...new Set(arr)]; // ["a", "b"]
Nie jest natywny w Javascript, ale wiele bibliotek ma tę metodę.
Underscore.js
_.uniq(array)
( link ) działa całkiem dobrze ( źródło ).źródło
Używając jQuery, oto unikalna funkcja Array, którą stworzyłem:
źródło
$.uniqueArray(arr)
? Osadzanie odniesień do jQuery wArray
prototypie wydaje się wątpliwe$.uniqueArray
jest, że jest on zależny od jQuery; to teżArray.prototype.unique
jest mniej oczywiste .prototype
s. Ale teraz rozumiem twój punkt widzenia. I tak zostawię to tutaj.Krótki i słodki roztwór z użyciem drugiej tablicy;
źródło
Szybki, kompaktowy, bez zagnieżdżonych pętli, działa z każdym obiektem, nie tylko łańcuchami i liczbami, pobiera predykat i tylko 5 linii kodu !!
Przykład: Aby znaleźć unikalne przedmioty według typu:
Jeśli chcesz, aby znalazł pierwszy unikalny element zamiast ostatniego, dodaj znaleziony.hasOwnPropery () sprawdź tam.
źródło
Potrzebujesz tylko zwykłego JS, aby znaleźć unikaty za pomocą Array.some i Array.reduce. W składni ES2015 to tylko 62 znaki.
Array.some i Array.reduce są obsługiwane w IE9 + i innych przeglądarkach. Po prostu zmień funkcje grubych strzałek na zwykłe funkcje, aby były obsługiwane w przeglądarkach, które nie obsługują składni ES2015.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects / Array / Reduce
źródło
Większość powyższych rozwiązań ma dużą złożoność w czasie wykonywania.
Oto rozwiązanie, które wykorzystuje
reduce
i może wykonać zadanie w czasie O (n).Uwaga:
To rozwiązanie nie jest uzależnione od redukcji. Pomysł polega na utworzeniu mapy obiektów i umieszczeniu unikatowych w tablicy.
źródło
Sposób ES6:
źródło
możesz użyć,
da Ci niepowtarzalne elementy,
**> ale jest haczyk,
drugą opcją jest użycie metody filtrującej na tablicy.
źródło
Możesz wpisać tablicę z duplikatami, a poniższa metoda zwróci tablicę z unikalnymi elementami.
źródło
Jedynym problemem z dotychczas podanymi rozwiązaniami jest wydajność. Jeśli martwisz się tym (i prawdopodobnie powinieneś), musisz unikać zagnieżdżonych pętli: for * for, filter * indexOf, grep * inArray, wszystkie iterują tablicę wiele razy. Możesz zaimplementować pojedynczą pętlę z rozwiązaniami takimi jak to lub to
źródło
źródło
Próbowałem tego problemu w czystym JS. Wykonałem następujące kroki: 1. Sortuj podaną tablicę, 2. zapętlaj posortowaną tablicę, 3. Sprawdź poprzednią wartość i następną wartość z wartością bieżącą
Próbny
źródło
źródło
Mając na uwadze, że
indexOf
zwróci pierwsze wystąpienie elementu, możesz zrobić coś takiego:źródło
Jeśli nie musisz się tak bardzo martwić o starsze przeglądarki, właśnie do tego są przeznaczone zestawy.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set
źródło
Kolejna myśl na to pytanie. Oto, co zrobiłem, aby to osiągnąć przy mniejszej ilości kodu.
źródło
źródło
Oto podejście z konfigurowalną
equals
funkcją, która może być używana zarówno do prymitywów, jak i do obiektów niestandardowych:stosowanie:
źródło
Moja odpowiedź używa
Array.filter
iArray.indexOf
metod, aby uzyskać unikalne wartościWidziałem to podejście na stronie internetowej, ale ich kod jest inny niż tutaj. Uprościłem kod do jednej linii i umieściłem go tutaj, aby ktoś na tym skorzystał
Uwaga: Moje podejście jest podobne lub takie samo, jak to, które opublikował Josh. Zostawiam to tutaj, ponieważ nazwy zmiennych są oczywiste w moim kodzie.
źródło
Zastanawiałem się tylko, czy możemy użyć wyszukiwania liniowego, aby wyeliminować duplikaty:
}
HTML:
źródło
Oto jedyne rozwiązanie problemu:
Skopiuj, wklej to do konsoli przeglądarki i uzyskaj wyniki, yo :-)
źródło
Mam wbudowaną funkcję JQuery Unique .
Więcej informacji można znaleźć w dokumentacji jquery API.
http://api.jquery.com/jquery.unique/
źródło