Metody tablic JavaScript

Siła JavaScript tablic ukryta jest w metodach tablic.

Konwertuje tablicę na ciąg znaków

Metoda JavaScript toString() Konwertuje tablicę na ciąg znaków wartości tablicy (rozdzielonych przecinkami).

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

Wynik

Banana,Orange,Apple,Mango

Spróbuj sam!

join() Metoda łączy wszystkie elementy tablicy w jeden ciąg znaków.

Jego zachowanie jest podobne do toString(), ale można określić znak rozdzielający:

Przykład

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");

Wynik

Banana * Orange * Apple * Mango

Spróbuj sam!

Usuwanie i Wkładanie

W przetwarzaniu tablic usuwanie elementów i dodawanie nowych elementów jest bardzo proste.

Usuwanie i Wkładanie oznaczają:

Z tablicyUsuwanieElement, lub do tablicyWkładanieElement.

Usuwanie

pop() Metoda usuwa ostatni element z tablicy:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();              // Usuwa ostatni element z fruits ("Mango")

Spróbuj sam!

pop() Metoda zwraca wartość "wyciągniętego" elementu:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.pop();      // Wartość x wynosi "Mango"

Spróbuj sam!

Dodawanie

push() Metoda (dodaje nowy element na koniec tablicy) dodaje nowy element do tablicy:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");       // Dodaje nowy element do fruits

Spróbuj sam!

push() Metoda zwraca długość nowego tablicy:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.push("Kiwi");   // Wartość x wynosi 5

Spróbuj sam!

Przesunięcie elementu

Przesunięcie jest równe wyciągnięciu, ale dotyczy pierwszego elementu zamiast ostatniego.

shift() Metoda usuwa pierwszy element i przesuwa wszystkie inne elementy do niższych indeksów.

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // Usuwa pierwszy element z fruits "Banana"

Spróbuj sam!

shift() Metoda zwraca przesunięty ciąg znaków:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();             // Zwraca "Banana"

Spróbuj sam!

unshift() Metoda (na początku) dodaje nowy element do tablicy i "przesuwa wstecz" stare elementy:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // Dodaje nowy element "Lemon" do fruits

Spróbuj sam!

unshift() Metoda zwraca długość nowej tablicy.

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // Zwraca 5

Spróbuj sam!

zmiana elementów

poprzez użycie ichnumer indeksuaby uzyskać dostęp do elementów tablicy:

tablicaindeks (indeks)Zaczynając od 0. [0] to pierwszy element tablicy, [1] to drugi, [2] to trzeci ...

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";        // Zmienia pierwszy element fruits na "Kiwi"

Spróbuj sam!

length Atrybut提供了向数组追加新元素的简单方法：

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";          // Dodaje "Kiwi" do fruits

Spróbuj sam!

usuń element

Ponieważ tablice JavaScript są obiektami, ich elementy mogą być usuwane za pomocą JavaScript delete operator dousuń:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // Zmienia pierwszy element fruits na undefined

Spróbuj sam!

Użyj delete Zostawia w tablicy 'niezdefiniowane miejsca'. Użyj pop() lub shift() Zamiast tego.

Łączenie tablic

splice() Metoda może być używana do dodawania nowych elementów do tablicy:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

Spróbuj sam!

Pierwszy parametr (2) definiuje pozycję (łączenie), w której powinien być dodany nowy element.

Drugi parametr (0) definiuje, ile elementów powinno być usuniętych.

Pozostałe parametry ("Lemon", "Kiwi") definiują nowe elementy do dodania.

splice() Metoda zwraca tablicę zawierającą usunięte elementy:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");

Spróbuj sam!

splice() do usunięcia elementów

Dzięki inteligentnemu ustawieniu parametrów, możesz użyć splice() Usunięcie elementów z tablicy bez pozostawiania 'pustych miejsc':

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // Usuwa pierwszy element z fruits

Spróbuj sam!

Pierwszy parametr (0) definiuje nowy element, który powinien byćdodaniedo którego należy dodać.

drugi parametr (1) określa pozycjęusunięcie wieluelementy.

pomijane są pozostałe parametry. Nie zostanie dodany żaden nowy element.

łączenie (łączenie) tablic

concat() metoda tworzy nową tablicę poprzez połączenie (łączenie) istniejących tablic:

przykład (łączenie dwóch tablic)

var mojeDziewczyny = ["Cecilie", "Lone"];
var mojeChłopcy = ["Emil", "Tobias", "Linus"];
var mojeDzieci = mojeDziewczyny.concat(mojegoChłopcy);   // Łączy mojeDziewczyny i mojeChłopcy

Spróbuj sam!

concat() metoda nie zmienia istniejącej tablicy. Zawsze zwraca nową tablicę.

concat() metoda może używać dowolnej liczby parametrów tablicowych:

przykład (łączenie trzech tablic)

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var mojeDzieci = arr1.concat(arr2, arr3);   // Łączy arr1, arr2 i arr3

Spróbuj sam!

concat() metoda może również przyjąć wartości jako parametry:

przykład (łączenie tablicy z wartością)

var arr1 = ["Cecilie", "Lone"];
var mojeDzieci = arr1.concat(["Emil", "Tobias", "Linus"]);

Spróbuj sam!

wycięcie tablicy

slice() metoda tworzy nową tablicę z fragmentu tablicy.

w tym przykładzie wytnie fragment tablicy od elementu 1 ("Orange"):

Przykład

var owoce = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var cytrusy = owoce.slice(1);

Spróbuj sam!

slice() metoda tworzy nową tablicę. Nie usuwa żadnych elementów z tablicy źródłowej.

w tym przykładzie wytnie fragment tablicy od elementu 3 ("Apple"):

Przykład

var owoce = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var cytrusy = owoce.slice(3);

Spróbuj sam!

slice() może przyjąć dwa parametry, np. (1, 3).

metoda wybiera elementy od parametru początkowego, aż do parametru końcowego (wyłączając go).

Przykład

var owoce = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var cytrusy = owoce.slice(1, 3);

Spróbuj sam!

jeśli parametr końcowy jest pomijany, np. w pierwszym przykładzie, to slice() wytnie resztę tablicy.

Przykład

var owoce = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var cytrusy = owoce.slice(2);

Spróbuj sam!

automatyczne wywołanie toString()

Jeśli potrzebujesz oryginalnej wartości, JavaScript automatycznie przekształci tablicę w ciąg znaków. Poniższe dwa przykłady będą miały ten sam wynik:

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

Spróbuj sam!

Przykład

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits;

Spróbuj sam!

Wszystkie obiekty JavaScript posiadają toString() metoda.

Sortowanie tablic

Nauczymy się sortowania tablic w następnym rozdziale~.

Znajdowanie największej i najmniejszej wartości w tablicy

Nie ma wbudowanych funkcji w JavaScript do wyszukiwania najwyższej i najniższej wartości w tablicy.

Nauczysz się rozwiązywać ten problem w następnym rozdziale tego tutoriala.

Pełny podręcznik tablic

Aby uzyskać pełny podręcznik, odwiedź nasz pełny Podręcznik tablic JavaScript.

Ten podręcznik zawiera opisy i przykłady wszystkich właściwości i metod tablic.