Array.
Tworzy tablicę z obiektu iterowalnego lub „tablicopodobnego”.
- Zwraca
- Nową tablicę.
- Zmienia oryginał
- Nie
Przykład
#console.log(Array.from('kod'))
console.log(Array.from(new Set([1, 2, 2, 3])))
console.log(Array.from({ length: 5 }, (_, i) => i + 1))Definicja i zastosowanie
#Metoda statyczna Array.from() zamienia na prawdziwą tablicę wszystko, po czym da się iterować albo co ma właściwość length: napis, Set, Map, listę elementów DOM (NodeList) czy obiekt { length: 3 }.
Drugi argument to funkcja mapująca, wywoływana dla każdego elementu. Dzięki temu łatwo wygenerować tablicę liczb: Array.from({ length: 5 }, (_, i) => i + 1).
W wielu przypadkach to samo da składnia rozproszenia [...iterable], ale Array.from() działa też z obiektami, które mają tylko length, i od razu mapuje.
Składnia
#Array.from(arrayLike)
Array.from(arrayLike, mapFn)Parametry
#arrayLike
obiekt iterowalny lub z length
Źródło elementów, np. napis, Set, NodeList.mapFn
opcjonalna function (element, index)
Funkcja przekształcająca każdy element.
Obsługa przeglądarek
#Szeroko dostępne
Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.
- Chrome
- Edge
- Firefox
- Safari
Dobre praktyki
#- Unikalne wartości tablicy uzyskasz przez
Array.from(new Set(array))albo[...new Set(array)]. - Lista elementów z
querySelectorAll()nie ma wszystkich metod tablic.Array.from()to naprawia.
Powiązane hasła
#- Array.isArray()Sprawdza, czy wartość jest tablicą.
- Spread (...)Składnia spread rozkłada tablicę, napis lub obiekt na pojedyncze elementy: do kopiowania, łączenia i przekazywania argumentów.
- SetKolekcja unikalnych wartości: każda wartość może wystąpić w zbiorze tylko raz.
- document.querySelectorAll()Zwraca statyczną listę (NodeList) wszystkich elementów pasujących do selektora CSS.
- Array.of()Tworzy nową tablicę z podanych argumentów, niezależnie od ich liczby i typu.
- Iteratory (Symbol.iterator)Protokół iteracji: obiekt z metodą [Symbol.iterator]() działa z for...of, spreadem i destrukturyzacją.
Widzisz błąd albo brakuje przykładu? Napisz do nas.