JavaScript taulukko menetelmät

JavaScript-taulukon voima piilee taulukkometodeissa.

Muunna taulukko merkkijonoksi

JavaScript-metodi toString() Muunna taulukko merkkijonoksi, jossa arvot ovat pilkulla erotettu.

Esimerkki

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

Tulos

Banana,Orange,Apple,Mango

Kokeile itse

join() Metodi voi yhdistää kaikki taulukon elementit yhdeksi merkkijonoksi.

Sen käyttäytyminen on samanlaista kuin toString(), mutta voit myös määrittää erotusmerkin:

Esimerkki

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

Tulos

Banana * Orange * Apple * Mango

Kokeile itse

Poistaminen ja Lisääminen

Kun käsittelet taulukkoa, elementin poistaminen ja uuden elementin lisääminen on erittäin yksinkertaista.

Poistaminen ja Lisääminen tarkoittaa:

Poista taulukostaPoistaProjekti, tai lisää elementtiä taulukkoonLisääProjekti.

Poistaminen

pop() Metodi poistaa viimeisen elementin taulukosta:

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();              // Poista viimeinen elementti fruits-taulukosta ("Mango")

Kokeile itse

pop() Metodi palauttaa "poistetun" arvon:

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.pop();      // x:n arvo on "Mango"

Kokeile itse

Lisääminen

push() Metodi lisää uuden elementin taulukon loppuun:

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");       // Lisää uusi elementti fruits-taulukkoon

Kokeile itse

push() Metodi palauttaa uuden taulukon pituuden:

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.push("Kiwi");   // x:n arvo on 5

Kokeile itse

Siirrä elementti

Siirtäminen on sama kuin pop, mutta se käsittelee ensimmäistä elementtiä eikä viimeistä.

shift() Metodi poistaa ensimmäisen taulukon elementin ja siirtää kaikki muiden elementit alaspäin.

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // Poista ensimmäinen elementti "Banana" fruitsista

Kokeile itse

shift() metodi palauttaa "siirretyn ulos" merkkijonon:

Esimerkki

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

Kokeile itse

unshift() metodi lisää uuden elementin taulukkoon (alkuun) ja "kääntää" vanhat elementit:

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // Lisää uusi elementti "Lemon" fruitsin alkuun

Kokeile itse

unshift() metodi palauttaa uuden taulukon pituuden.

Esimerkki

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

Kokeile itse

muuttaaksesi elementtejä

käyttämällä niidenindeksitarkastellakseen taulukon elementtejä:

taulukkoindeksi (alaviiva)alkaen 0. [0] on ensimmäinen taulukon elementti, [1] toinen, [2] kolmas ...

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";        // Muuta fruitsin ensimmäinen elementti "Kiwi":ksi

Kokeile itse

length ominaisuuksien avulla helposti lisätäksesi uusia elementtejä taulukkoon:

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";          // Lisää "Kiwi" fruitsin loppuun

Kokeile itse

Poista elementti

koska JavaScript-taulukot ovat objekteja, niiden elementtejä voidaan käyttää JavaScriptin delete laskinPoista:

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // Muuta ensimmäinen elementti fruitsista undefined:ksi

Kokeile itse

Käytä delete jättää taulukkoon määrittelemättömiä aukkoja. Käytä pop() tai shift() Sen sijaan.

Yhdistä taulukot

splice() Metodi voidaan käyttää lisätäksesi uusia kohteita taulukkoon:

Esimerkki

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

Kokeile itse

Ensimmäinen parametri (2) määrittää, mihin sijaintiin uusi elementti lisätään (liitetään).

Toinen parametri (0) määrittää, kuinka monta elementtiä poistetaan.

Muut parametrit ("Lemon", "Kiwi") määrittävät lisättävät uudet elementit.

splice() Metodi palauttaa taulukon poistetuista kohteista:

Esimerkki

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

Kokeile itse

splice() poistaaksesi elementtejä

Käyttämällä viisaasti parametreja voit käyttää splice() Poista elementti ilman, että jätät 'tyhjiä tilaa' taulukkoon:

Esimerkki

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // Poista ensimmäinen elementti fruitsista

Kokeile itse

Ensimmäinen parametri (0) määrittää, missä uusi elementti tulisi ollaLisääsijainti.

Toinen parametri (1) määrittää tulisiPoista useitaelementti.

Loput parametrit jätetään pois. Uusia elementtejä ei lisätä.

Yhdistä (yhdistä) taulukot

concat() Menetelmä luo uuden taulukon yhdistämällä (yhdistämällä) nykyisiä taulukoita:

Esimerkki (yhdistää kaksi taulukkoa)

var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys);   // Yhdistää myGirls ja myBoys

Kokeile itse

concat() Menetelmä ei muuta nykyistä taulukkoa. Se aina palauttaa uuden taulukon.

concat() Menetelmä voi käyttää mihin tahansa määrään taulukkoargumentteja:

Esimerkki (yhdistää kolme taulukkoa)

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3);   // Yhdistää arr1, arr2 ja arr3

Kokeile itse

concat() Menetelmä voi myös käyttää arvoja parametreina:

Esimerkki (yhdistää taulukon ja arvon)

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

Kokeile itse

Leikkaa taulukkoa

slice() Menetelmä luo uuden taulukon taulukon jossain osassa.

Tässä esimerkissä alkaa leikata taulukon elementistä 1 ("Orange"):

Esimerkki

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

Kokeile itse

slice() Menetelmä luo uuden taulukon. Se ei poista mitään elementtejä alkutaulukosta.

Tässä esimerkissä alkaa leikata taulukon elementistä 3 ("Apple"):

Esimerkki

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

Kokeile itse

slice() Se voi hyväksyä kaksi parametria, kuten (1, 3).

Tämä menetelmä valitsee alkuparametrin mukaan elementtejä, aina loppuparametriin (ei sisälly) asti.

Esimerkki

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

Kokeile itse

Jos loppuparametri jätetään pois, kuten ensimmäisessä esimerkissä slice() Se leikkaa pois taulukon jäljelle jäävän osan.

Esimerkki

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

Kokeile itse

toString() itsestään

Jos tarvitset alkuperäisiä arvoja, JavaScript muuntaa automaattisesti taulukon merkkijonoksi. Seuraavat kaksi esimerkkiä tuottavat saman tuloksen:

Esimerkki

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

Kokeile itse

Esimerkki

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

Kokeile itse

Kaikki JavaScript-objektit omaavat toString() menetelmä.

Taulukon järjestäminen

Opit seuraavassa luvussa taulukon järjestämisen.

Etsi taulukosta suurin ja pienin arvo

JavaScriptilla ei ole sisäänrakennettuja funktioita, jotka etsivät suurinta ja pienintä arvoa taulukosta.

Opit seuraavassa luvussa, miten ratkaista tämä ongelma.

Täydellinen taulukko-käyttöohje

Täydelliselle käyttöohjeelle käyntiin JavaScript-taulukon käyttöohje.

Tämä käyttöohje sisältää kaikkien taulukon ominaisuuksien ja metodioiden kuvaukset ja esimerkit.