Kuinka poistaa tietty JavaScript-taulukkoelementti? JavaScript-taulukkomenetelmät

Splice()-menetelmä muuttaa taulukon sisältöä poistamalla tai korvaamalla olemassa olevia elementtejä ja/tai lisäämällä uusia elementtejä paikalleen.

Tämän interaktiivisen esimerkin lähde on tallennettu GitHub-tietovarastoon. Jos haluat osallistua interaktiivisten esimerkkien projektiin, kloonaa https://github.com/mdn/interactive-examples ja lähetä meille vetopyyntö.

Syntaksi anna arrDeletedItems = array .splice(alku [, deleteCount [, item1 [, item2 [, ...]]]]) Parametrit start Indeksi, josta taulukon muuttaminen aloitetaan. Jos suurempi kuin taulukon pituus, aloitus asetetaan taulukon pituuteen. Jos negatiivinen, se alkaa niin monta elementtiä taulukon lopusta. (Tässä tapauksessa origo -1 , mikä tarkoittaa - n on n:nnen viimeisen elementin indeksi, ja vastaa siten taulukon .length - n indeksiä.) Jos array .length + start on pienempi kuin 0, se on alkaa indeksistä 0. deleteCount Valinnainen Kokonaisluku, joka ilmaisee alusta poistettavien taulukon elementtien määrän. Jos deleteCount jätetään pois tai jos sen arvo on yhtä suuri tai suurempi kuin array .length - start (eli jos se on yhtä suuri tai suurempi kuin taulukossa jäljellä olevien elementtien lukumäärä alusta alkaen), kaikki elementit taulukon alusta loppuun poistetaan.

Huomautus: IE8:ssa se ei poista kaikkia, jos deleteCount jätetään pois.

Jos deleteCount on 0 tai negatiivinen, mitään elementtejä ei poisteta. Tässä tapauksessa sinun tulee määrittää vähintään yksi uusi elementti (katso alla). item1 , item2 , ... Valinnainen Matriisiin lisättävät elementit alusta alkaen . Jos et määritä mitään elementtejä, splice() poistaa vain elementtejä taulukosta.

Palautusarvo

Poistetut elementit sisältävä taulukko.

Jos vain yksi elementti poistetaan, palautetaan yhden elementin joukko.

Jos mitään elementtejä ei poisteta, palautetaan tyhjä taulukko.

Kuvaus

Jos määritetty lisättävien elementtien määrä eroaa poistettavien elementtien määrästä, taulukon pituus on erilainen puhelun lopussa.

Esimerkkejä Poista 0 (nolla) elementtiä indeksistä 2 ja lisää "rumpu" anna myFish = ["enkeli", "klovni", "mandariini", "sammpi"] anna poistettu = myFish.splice(2, 0, "rumpu" ) // myFish on ["enkeli", "klovni", "rumpu", "mandariini", "sammpi"] // poistettu on , elementtejä ei poistettu Poista 0 (nolla) elementtiä hakemistosta 2 ja lisää "rumpu" ja "kitara" let myFish = ["enkeli", "klovni", "mandariini", "sammpi"] let poistettu = myFish.splice(2, 0, "rumpu", "kitara") // myFish on ["enkeli" , "klovni", "rumpu", "kitara", "mandariini", "sammpi"] // poistettu on , elementtejä ei poistettu Poista 1 elementti hakemistosta 3 let myFish = ["enkeli", "klovni", "rumpu" , "mandarin", "sammpi"] let poistettu = myFish.splice(3, 1) // poistettu on ["mandarin"] // myFish on ["enkeli", "klovni", "rumpu", "sammpi"] Poista 1 elementti hakemistosta 2 ja lisää "trumpetti" let myFish = ["enkeli", "klovni", "rumpu", "sammpi"] let poistettu = myFish.splice(2, 1, "trumpet") // myFish on ["enkeli", "klovni", "trumpetti", "sammpi"] // poistettu on ["rumpu"] Poista 2 elementtiä indeksistä 0 ja lisää "parrot", "anemone" ja "blue" anna myFish = ["enkeli", "klovni", "trumpetti", "sammpi"] anna poistettu = myFish.splice(0, 2, "parrot", "anemone", "blue") // myFish on ["papukaija", " anemone", "blue", "trumpet", "sammpi"] // poistettu on ["angel", "clown"] Poista 2 elementtiä hakemistosta 2 let myFish = ["papaukaija", "anemone", "blue", "trumpet", "sammpi"] anna poistettu = myFish.splice(2, 2) // myFish on ["papukaija", "anemone", "sammpi"] // poistettu on ["blue", "trumpet"] Poista 1 elementti indeksistä -2 let myFish = ["enkeli", "klovni", "mandariini", "sammpi"] anna poistettu = myFish.splice(-2, 1) // myFish on ["enkeli", "klovni" , "sammpi"] // poistettu on ["mandarin"] Poista kaikki elementit indeksin 2 jälkeen (sis.) let myFish = ["enkeli", "klovni", "mandariini", "sammpi"] let poistettu = myFish.splice (2) // myFish on ["enkeli", "klovni"] // poistettu on ["mandariini", "sammpi"] Tekniset tiedot Specification Status Kommentti
ECMAScriptin uusin luonnos (ECMA-262)
Luonnos
ECMAScript 2015 (6. painos, ECMA-262)
"Array.prototype.splice" määritelmä kyseisessä määrittelyssä.
Vakio
ECMAScript 5.1 (ECMA-262)
"Array.prototype.splice" määritelmä kyseisessä määrittelyssä.
Vakio
ECMAScript 3rd Edition (ECMA-262) Vakio Alkuperäinen määritelmä. Toteutettu JavaScript 1.2:ssa.
Selaimen yhteensopivuus

Tämän sivun yhteensopivuustaulukko on luotu strukturoiduista tiedoista. Jos haluat osallistua tietoihin, käy osoitteessa https://github.com/mdn/browser-compat-data ja lähetä meille vetopyyntö.

Päivitä GitHubin yhteensopivuustiedot

Pöytäkoneen mobiilipalvelin Chrome Edge Firefox Internet Explorer Opera Safari Android-verkkonäkymä Chrome Androidille Firefox Androidille Opera Androidille Safari iOS:ssä Samsung Internet Node.jsliitos
Chrome Täysi tuki 1Edge Täysi tuki 12Firefox Täysi tuki 1IE Täysi tuki 5.5

Huomautuksia

Täysi tuki 5.5

Huomautuksia

Huomautuksia Internet Explorer 5.5 - 8:ssa kaikkia taulukon elementtejä ei poisteta, jos deleteCount jätetään pois. Tämä toiminta on korjattu Internet Explorer 9:ssä.
Opera Täysi tuki KylläSafari Täysi tuki 1WebView Android Täysi tuki KylläChrome Android Täysi tuki 18Firefox Android Täysi tuki 4Opera Android Täysi tuki KylläSafari iOS Täysi tuki 1Samsung Internet Android Täysi tuki Kyllänodejs Täysi tuki Kyllä
Selite Täysi tuki Täysi tuki Katso toteutusohjeet. Katso toteutusohjeet.

Tauluja voidaan käsitellä useilla Array-konstruktorin tarjoamilla menetelmillä.

Pop/push ja shift/unshift menetelmät

Katsotaanpa pop()- ja push()-menetelmiä. Näiden menetelmien avulla voit työskennellä taulukoiden kanssa ikään kuin ne olisivat pinoja. Pino on tietorakenne, jossa pääsy elementteihin on järjestetty LIFO-periaatteen mukaisesti (englanniksi: last in - first out, "last in - first out"). Pinon toimintaperiaatetta voidaan verrata lautaspinoon: ottaaksesi toisen ylhäältä, sinun on poistettava ylin. Kuinka se toimii, näkyy kuvassa:

Ja niin palataanpa katsomaan push()- ja pop()-menetelmiä. Push()-menetelmä lisää yhden tai useamman uuden elementin taulukon loppuun ja palauttaa sen uuden pituuden. pop() -menetelmä - poistaa taulukon viimeisen elementin, lyhentää taulukon pituutta ja palauttaa poistetun arvon. On syytä huomata, että molemmat menetelmät muokkaavat taulukkoa paikallaan sen sijaan, että luovat siitä muokatun kopion.

Var foo = ; // foo: foo.push(1,2); // foo: Palauttaa 2 foo.pop(); // foo: Palauttaa 2 foo.push(3); // foo: Palauttaa 2 foo.pop(); // foo: Palauttaa 3 foo.push(); // foo: ] Palauttaa 2 foo.pop() // foo: Palauttaa foo.pop(); // foo: Palauttaa 1 var fruits = ["päärynät", "banaanit", "omenat"]; var picked = hedelmät.pop(); document.write("Valitsit minun " + valitsin); Yrittää "

Shift()- ja unshift()-menetelmät toimivat paljolti samalla tavalla kuin pop() ja push(), paitsi että ne lisäävät ja poistavat elementtejä taulukon alkuun. Unshift()-menetelmä siirtää olemassa olevia elementtejä suurempiin indekseihin tehdäkseen tilaa uusille elementeille, lisää yhden tai useamman elementin taulukon alkuun ja palauttaa taulukon uuden pituuden. Shift()-menetelmä poistaa taulukon ensimmäisen elementin ja palauttaa sen arvon siirtämällä kaikki seuraavat elementit täyttämään taulukon alussa olevan vapaan tilan.

Muutt f = ; // f: f.unshift(1); // f: Palauttaa: 1 f.unshift(22); // f: Palauttaa: 2 f.shift(); // f: Palauttaa: 22 f.unshift(3,); // f:,1] Palauttaa: 3 f.shift(); // f:[,1] Palauttaa: 3 f.shift(); // f: Palauttaa: f.shift(); // f: Palauttaa: 1

liittymismenetelmä

Array.join()-menetelmää käytetään yhdistämään taulukon elementit yhdeksi merkkijonoksi. Metodille voidaan välittää valinnainen merkkijonoargumentti, jota käytetään erottamaan merkkijonon elementit. Jos erotinta ei ole määritetty, oletuserotinmerkki menetelmää kutsuttaessa on pilkku.

Var a = ["Tuuli","Sade","Tuli"]; var myVar1 = a.join(); //"Tuuli,sade,Tuli" var myVar2 = a.join(", "); //"Tuuli, sade, tuli" var myVar3 = a.join(" + "); //"Tuuli + sade + tuli" document.write(myVar1 + "
" + myVar2 + "
" + myVar3); Kokeile "

Array.join()-menetelmä on käänteismenetelmä String.split()-menetelmälle, joka luo taulukon jakamalla merkkijonon fragmenteiksi.

käänteinen menetelmä

Array.reverse()-menetelmä kääntää taulukon elementtien järjestyksen ja palauttaa taulukon, jossa elementit on järjestetty uudelleen. Tämä menetelmä ei luo uutta taulukkoa uudelleenjärjestetyillä elementeillä, vaan pikemminkin järjestää ne uudelleen olemassa olevaan taulukkoon.

Var myArr = ["yksi", "kaksi", "kolme"]; document.write(myArr.reverse()); Yrittää "

concat menetelmä

Array.concat()-menetelmä luo ja palauttaa uuden taulukon, joka sisältää sen alkuperäisen taulukon elementit, jolle concat() kutsuttiin, lisättynä peräkkäin kaikkien concat()-funktiolle välitettyjen argumenttien arvoilla. Jos jokin näistä argumenteista on itse taulukko, kaikki sen elementit lisätään. Taulukon nimiä käytetään argumentteina ja ne määritetään siinä järjestyksessä, jossa niiden elementit yhdistetään.

Var a = ; a.concat(4, 5) //Palauttaa a.concat(); //sama asia - palauttaa a.concat(,) //Palauttaa

lajittelumenetelmä

Array.sort()-menetelmä lajittelee taulukon elementit paikoilleen ja palauttaa lajitellun taulukon. Jos sort()-menetelmää kutsutaan ilman argumenttia, se lajittelee taulukon elementit aakkosjärjestykseen (muuntaa ne tilapäisesti merkkijonoiksi vertailun suorittamiseksi). Sort()-menetelmä voi ottaa vertailufunktion argumenttina, joka määrittää elementtien lajittelujärjestyksen.

Var a = ["Kiivi", "appelsiinit", "päärynät"]; eräänlainen(); var s = a.join(", "); //appelsiinit, päärynät, kiivi document.write(s); //esimerkki numeroilla var myArr = ; myArr.sort(); document.write(myArr); //1,10,2 Kokeile »

Luultavasti odotit näkeväsi hieman erilaisen tuloksen numeroiden lajittelusta. Tämä lajittelu tapahtuu, koska sort()-menetelmä lajittelee elementit muuntamalla ne merkkijonoiksi. Siksi heidän järjestyksensä osoittautuu merkkijonoksi - loppujen lopuksi "10"

Jos haluat lajitella muuhun kuin aakkosjärjestykseen, voit välittää vertailufunktion argumenttina sort()-metodille. On kuitenkin otettava huomioon, että sinun on kirjoitettava vertailufunktio itse. Tällä funktiolla on oltava kaksi parametria, koska se määrittää, kumpi sen kahdesta argumentista näkyy ensimmäisenä lajitetussa luettelossa. Sellaisen funktion ymmärtämisen ja kirjoittamisen helpottamiseksi on olemassa useita sääntöjä, joiden mukaan elementtien järjestys määritetään:

  • Jos ensimmäisen argumentin on oltava ennen toista, vertailufunktio palauttaa negatiivisen luvun (jos a
  • Jos ensimmäisen argumentin on seurattava toista, vertailufunktio palauttaa positiivisen luvun (jos a > b)
  • Jos kaksi arvoa ovat samanarvoisia (eli niiden järjestys ei ole tärkeä), vertailufunktio palauttaa 0 (jos a == b)

Vertailun vuoksi funktio käyttää taulukkoelementtejä argumentteinaan:

Funktio foo(a,b) ( //määritä tarkistusfunktio jos (a b) return 1; return 0; //jos a == b ) var a = ; a.sort(foo); //vain funktion nimi välitetään argumenttina document.write(a.join(", ")); //kirjoita sama asia lyhyemmin var a = ; a.sort(function(a,b) ( //käytä anonyymiä funktiota return a - b; //funktio palauttaa arvon 0 )); document.write(a); //1,2,5,10 Kokeile »

Esimerkin ensimmäinen merkintä on kirjoitettu tällä tavalla, jotta on helpompi ymmärtää, miten se toimii. Huomaa, kuinka kätevää on käyttää anonyymiä funktiota toisessa fragmentissa. Sitä kutsutaan vain kerran, joten sille ei tarvitse antaa nimeä.

Huomautus: Jos taulukossa on määrittelemättömiä elementtejä, ne siirretään taulukon loppuun.

siivumenetelmä

Array.slice()-menetelmää käytetään määritetyn osan kopioimiseen taulukosta ja se palauttaa uuden taulukon, joka sisältää kopioidut elementit. Alkuperäinen taulukko ei muutu.

Menetelmän syntaksi:

ArrayName.slice(alku, loppu);

Taulukon_nimi tulee korvata sen taulukon nimellä, josta haluat poimia tietyn joukon elementtejä uutta taulukkoa varten. Menetelmä ottaa kaksi argumenttia, jotka määrittävät palautetun taulukon alun ja lopun. Menetelmä kopioi osan taulukosta alkaen alusta loppuun, ei sisällä loppua. Jos vain yksi argumentti annetaan, palautettu taulukko sisältää kaikki elementit määritetystä paikasta taulukon loppuun. Voit käyttää negatiivisia indeksejä - ne lasketaan taulukon lopusta.

Var arr = ; arr.slice(0,3); //Palauttaa arr.slice(3); //Palauttaa arr.slice(1,-1); //Palauttaa arr.slice(-3,-2); //Palauttaa

liitosmenetelmä

Array.splice()-menetelmä on yleinen menetelmä taulukoiden käsittelyyn. Se muokkaa taulukkoa paikallaan sen sijaan, että palauttaisi uuden muokatun taulukon, kuten slice()- ja concat()-metodit tekevät. Jatkomenetelmällä voidaan poistaa elementtejä taulukosta, lisätä uusia elementtejä, korvata elementtejä - yksi kerrallaan ja samanaikaisesti. Se palauttaa taulukon, joka koostuu poistetuista elementeistä, jos mitään elementtiä ei ole poistettu, se palauttaa tyhjän taulukon.

Menetelmän syntaksi:

Array_name.splice(indeksi, määrä, element1, ..., elemN);

Ensimmäinen argumentti määrittää taulukon indeksin, josta elementtien lisääminen tai poistaminen aloitetaan. Toinen argumentti määrittää elementtien määrän, jotka tulee poistaa taulukosta alkaen ensimmäisessä argumentissa määritetystä indeksistä, jos toinen argumentti on 0, mitään elementtejä ei poisteta. Jos toinen argumentti jätetään pois, kaikki taulukon elementit määritetystä indeksistä taulukon loppuun poistetaan. Käytettäessä negatiivista sijaintinumeroa, elementit lasketaan taulukon lopusta.

Var hedelmät = ["appelsiinit", "omenat", "päärynät", "rypäleet"]; var poistettu = hedelmät.liitos(2,2); //palauttaa ["päärynät", "rypäleet"] document.write(poistettu); var arr = ; arr.splice(4); //Palauttaa ; taulukosta tuli: arr.splice(1,2); //Palauttaa ; taulukosta tuli: arr.splice(1,1); //Palauttaa ; joukosta tuli: Kokeile »

Splice()-menetelmän kaksi ensimmäistä argumenttia määrittävät poistettavat taulukkoelementit. Näitä kahta argumenttia voi seurata mikä tahansa määrä lisäargumentteja, jotka määrittelevät taulukkoon lisättävät elementit, alkaen ensimmäisen argumentin määrittämästä kohdasta.

Var hedelmät = ["appelsiinit", "omenat"]; hedelmät.splice(2,0, "vesimelonit"); //palauttaa document.write(fruits); //tuli ["appelsiinit", "omenat", "vesimelonit"] var arr = ; arr.splice(2,0"a","b"); //Palauttaa ; tuli arr.splice(2,2,); //Palauttaa ["a","b"]; tuli ,3,4,5] Kokeile »

On syytä huomata, että toisin kuin concat(), splice()-menetelmä ei jaa argumentteina välitettyjä taulukoita yksittäisiksi elementeiksi. Eli jos menetelmälle välitetään lisättävä taulukko, se lisää itse taulukon, ei kyseisen taulukon elementtejä.

toString-menetelmä

ToString()-menetelmä muuntaa taulukon elementit merkkijonoksi käyttämällä pilkkua erotinmerkkinä.

Var arr = ["Maito","Leipä","Evästeet"]; var ruoka = arr.toString(); document.write(ruoka); //Maito,leipä,keksejä Kokeile »

Huomaa, että menetelmä palauttaa saman merkkijonon kuin join(), kun sitä kutsutaan ilman argumentteja.

indexOf ja lastIndexOf

IndexOf-metodi palauttaa elementin indeksin, jonka arvo on yhtä suuri kuin menetelmälle argumenttina välitetty arvo.

IndexOf()- ja lastIndexOf()-menetelmien syntaksi:

Array_name.indexOf(hakuelementti, indeksi) taulukon_nimi.viimeinenIndeksi(hakuelementti, indeksi)

Menetelmän ensimmäinen argumentti määrittää sen elementin arvon, jonka indeksi on löydettävä, toinen argumentti (valinnainen) määrittää indeksin, josta haku aloitetaan. Jos identtisiä esiintymiä on useita, valitaan pienin (ensimmäinen) indeksi. Jos halutun arvon omaavaa elementtiä ei löydy, menetelmä palauttaa -1. Metodin sisällä hakuun käytetään tiukkaa vertailua (===).

Var a = ; a.indexOf(3); //return 2 a.indexOf(3,4); //return 6 a.indexOf(35); //return -1: tällä arvolla ei ole elementtiä a.indexOf(2); // 1

LastIndexOf()-metodi palauttaa myös elementin indeksin, jonka arvo on yhtä suuri kuin menetelmälle argumenttina välitetty arvo. Ainoa ero on, että lastIndexOf()-menetelmä valitsee suurimman (viimeisen) indeksin.

Var a = ; a.lastIndexOf(3); //return 7 a.lastIndexOf(35); //return -1: tällä arvolla ei ole elementtiä a.lastIndexOf(2); // 6

Iteraattorimenetelmät

Alla kuvatut menetelmät ovat iteraattoreita. Kaikissa nykyaikaisissa selaimissa on menetelmiä työskennellä taulukoiden kanssa, jotka on suunniteltu iteroimaan elementtien yli ja suorittamaan niille erilaisia ​​toimintoja. Nämä menetelmät ovat forEach(), map(), suodatin(), every(), some, reduktor() ja redightRight().

Ne iteroivat taulukon elementtejä alkaen 0:sta pituuteen - 1 ja, jos elementti on olemassa, välittävät sen takaisinsoittokäsittelyn funktiolle.

jokaiselle

Menetelmän syntaksi:

ArrayName.forEach(takaisinsoitto, thisArg)

Ensimmäinen argumentti määrittää takaisinkutsun funktion, jota forEach()-metodi kutsuu jokaiselle taulukon elementille. Kutsutun käsittelijän funktion toteutus on kirjoitettava itse. Kutsutulla funktiolla on oltava kolme parametria: ensimmäinen parametri ottaa argumenttina taulukkoelementin arvon, toinen - elementin indeksin ja kolmas - itse taulukon. Jos kuitenkin tarvitset vain taulukon elementtien arvoja, voit kirjoittaa funktion vain yhdellä parametrilla. Toinen argumentti - thisArg (valinnainen) välitetään tämän arvona.

Var arr = ; funktio foo(arvo) ( var summa = arvo * tämä; return document.write(summa + "
"); ) arr.forEach(foo, 5); //toinen argumentti välitetään tämän //esimerkin arvona kolmella parametrilla var a = ; a.forEach(function(el, idx, a) ( dokumentti .write( "a["+idx+"] = "+el+" in ["+a+"]
"); )); Yrittää "

suodattaa

Menetelmän syntaksi:

Array_name.filter(takaisinsoitto, tämä objekti)

Filter()-menetelmä luo ja palauttaa uuden taulukon, joka sisältää vain ne taulukon elementit, joille takaisinkutsufunktio palauttaa tosi.

Funktio isBig(elementti, indeksi, array) ( //palauttaa luvut, jotka ovat suurempia tai yhtä suuria kuin 10 return (elementti >= 10); //jos elementin arvo on suurempi tai yhtä suuri kuin 10, lauseke palauttaa true ) var filtered = .filter(isBig) ; //suodatettu

kartta

Map()-menetelmä luo ja palauttaa uuden taulukon, joka koostuu taulukon kunkin elementin callback(item, idx, ar) -funktion kutsumisen tuloksista.

Var a = ; var b = a.map(funktio(nimike, idx, arr) ( palauta nimike * tuote; )); // b =

kaikki ja jotkut

Every()-metodi palauttaa tosi, jos taulukon kaikille elementeille määritetty funktio palauttaa niiden tarkistamiseen käytetty funktio tosi.

Some()-metodi palauttaa tosi, jos yksi tai useampi määritetyn funktion elementti palauttaa true testauksen aikana.

Var a = ; a.every(function(x) ( paluu x 10; )) //true: yksi numero > 10

vähennä ja vähennäOikea

Menetelmän syntaksi:

taulukon_nimi.reduce(takaisinkutsu, aloitusarvo) array_name.reduceRight(takaisinkutsu, aloitusarvo)

Reduction()-menetelmä soveltaa määritettyä takaisinkutsun funktiota kahteen taulukon arvoon kerralla, iteroiden elementtien läpi vasemmalta oikealle ja tallentaa samalla välituloksen.

takaisinkutsufunktion argumentit: (previousValue, currentItem, index, array)

  • previousValue - takaisinsoittofunktion palautettu tulos (tunnetaan myös välituloksena)
  • currentItem - taulukon nykyinen elementti (elementit lajitellaan järjestyksessä vasemmalta oikealle)
  • index - nykyisen elementin indeksi
  • array - käsitelty array

originalValue on objekti, jota käytetään ensimmäisenä takaisinkutsun ensimmäisenä argumenttina. Yksinkertaisesti sanottuna previousValue-arvon arvo ensimmäisen kutsun yhteydessä on yhtä suuri kuin alkuperäinen arvo. Jos aloitusarvoa ei ole, se on yhtä suuri kuin taulukon ensimmäinen elementti ja haku alkaa toisesta:

Var a = ; funktio foo(ed.Num,curNum) ( summa = edellinenNum + curNum; hälytys(summa); paluusumma; ) var tulos = a.reduce(foo, 0); document.write(tulos); Yrittää "

Katsotaanpa, miten tämä esimerkki toimii. Ensimmäiset argumentit funktiolle foo ovat:

  • prevNum = 0 (koska aloitusarvo on 0)
  • curNum = 1 (nykyinen elementti on taulukon 1. elementti)

1 lisätään numeroon 0. Tämä tulos (summa: 1) välitetään arvona prevNum, kun funktio ajetaan seuraavan kerran. Ja niin edelleen, kunnes se saavuttaa viimeisen elementin. Palautettu tulos, summa viimeisestä ajosta, on 15 (1+2+3+4+5).

ReductionRight-menetelmä toimii samalla tavalla kuin vähennysmenetelmä, mutta se kulkee taulukon läpi oikealta vasemmalle:

Var a = ["h","o","m","e"]; function bar(prevStr, curItem) ( return prevStr + curItem; ) document.write(a.reduceRight(bar)); //emoh

Javascript-taulukoiden splice()-menetelmä muokkaa taulukon sisältöä lisäämällä uusia elementtejä ja poistamalla vanhoja

Sen syntaksi on seuraava:

Array.splice(indeksi, kuinka monta, [, ..., elementtiN]);

Parametrien tiedot
  • index – Indeksi, jossa taulukko alkaa muuttua.
  • howMany – kokonaisluku, joka ilmaisee poistettavien vanhojen taulukon elementtien määrän. Jos howMany on 0, mitään elementtejä ei poisteta.
  • elementti1, ..., elementN – taulukkoon lisätyt elementit. Jos et määritä mitään elementtejä, liitos yksinkertaisesti poistaa elementit taulukosta.
Palautusarvo

Palauttaa puretun taulukon välitettyjen parametrien perusteella.

Esimerkki

Kokeile seuraavaa esimerkkiä.

JavaScript - taulukot. Method splice var arr = ["appelsiini", "meloni", "maito", "sokeri", "kahvi"]; var poistettu = arr.splice(2, 0, "vesi"); document.write("1:n lisäämisen jälkeen: " + arr); document.write("
poistettu: " + poistettu); poistettu = arr.splice(3, 1); document.write("
1:n lisäämisen jälkeen: " + arr); document.write("
poistettu: " + poistettu);

Tulos 1 lisäyksen jälkeen: appelsiini,meloni,vesi,maito,sokeri,kahvi poistettu: 1 lisäyksen jälkeen: appelsiini,meloni,vesi,sokeri,kahvi poistettu:maito

JavaScriptissä on useita tapoja poistaa taulukkoelementti. Näitä ovat pop- ja shift-menetelmät. Pop-menetelmä poistaa ensimmäisen elementin annetusta taulukosta. Siirtomenetelmä poistaa viimeisen elementin annetusta taulukosta.

Voit asettaa taulukon pituudeksi 0, jos haluat poistaa kaikki elementit annetusta taulukosta. Mutta mitä, pitääkö tietty elementti poistaa?

Esimerkiksi:

Array_name.splice(indeksi);

Array_name.delete

Voit käyttää liitosmenetelmää. Se palauttaa uuden joukon poistettuja elementtejä. Ja alkuperäinen matriisi sisältää loput elementit.

Tutustu alla olevaan esittelyyn oppiaksesi käyttämään JavaScript-liitosmenetelmää ja muita tapoja poistaa tiettyjä elementtejä.

Esittely tietyn elementin poistamisesta liitosmenetelmällä

Tämä demo luo joukon numeroita. Aluksi taulukkoon lisätään viisi elementtiä. Tämän jälkeen käytetään liitosmenetelmää kolmannen elementin poistamiseen. Samalla tavalla voit poistaa taulukon ensimmäisen elementin JavaScriptissä.

Numeerisen taulukon elementit näytetään ennen ja jälkeen JavaScript-liitosmenetelmän käytön seuraavasti:

JavaScript-koodi liitosmenetelmällä:


"; for (i=0; i< Arr_Numbers.length; i++){ the_arr_before_after += Arr_Numbers[i] + "
"; ) document.getElementById("p1").innerHTML = the_arr_before_after; Arrretrun = Arr_Numbers.splice(2,1); var the_arr_before_after = "Matriisielementit liitosmenetelmän jälkeen:
"; for (i=0; i< Arr_Numbers.length; i++){ the_arr_before_after += Arr_Numbers[i] + "

Huomaat, että käytin kahta JavaScript-parametria taulukkoelementin poistamiseen. Ensimmäinen määrittää poistettavan elementin indeksin. Toinen on se, kuinka monta elementtiä on poistettava määritetyn avaimen jälkeen.

Seuraava esittely näyttää tapauksen, jossa käytämme toista parametria.

Entä jos toista parametria ei ole määritetty JavaScript-liitosmenetelmässä?

Käyttämällä samaa koodia, mutta ilman liitosmenetelmän toista parametria:

Arr_Numbers.splice(2);

Koodi ja tulos:

Katso online-demo ja koodi

Kuten näet, kaikki elementit ennen määritettyä indeksinumeroa on myös poistettu. Lisäksi liitosmenetelmä palauttaa joukon poistettuja elementtejä.

JavaScript-koodi:

var Arr_Numerot = ; var i; var the_arr_before_after = "Alkuperäinen taulukko:
"; for (i=0; i< Arr_Numbers.length; i++){ the_arr_before_after += Arr_Numbers[i] + "
"; ) document.getElementById("p1").innerHTML = the_arr_before_after; Arrretrun = Arr_Numbers.splice(2); var the_arr_before_after = "Matriisielementit liitosmenetelmän jälkeen:
"; for (i=0; i< Arr_Numbers.length; i++){ the_arr_before_after += Arr_Numbers[i] + "
"; ) document.getElementById("p2").innerHTML = the_arr_before_after; //Poistetut taulukkoelementit palautetusta taulukosta var the_arr_before_after = "Poistetut taulukkoelementit:
"; for (i=0; i< Arrretrun.length; i++){ the_arr_before_after += Arrretrun[i] + "
"; ) document.getElementById("p3").innerHTML = the_arr_fore_after;

Poista-toiminnon käyttäminen taulukon elementin poistamiseen

Voit myös poistaa JavaScriptin taulukkoelementin poistamistoiminnolla. Mutta se säästää tyhjää tilaa, ja jos palautat kyseisen taulukon funktion käytön jälkeen, poistettu elementti hahmonnetaan määrittelemättömäksi .

Katsotaanpa demoa, joka käyttää poistotoimintoa:

Katso online-demo ja koodi

JavaScript-koodi:

var Arr_Strings = ["The","JavaScript","Matriisi","Totorial"]; var i; var the_arr_before_after = "Alkuperäiset merkkijonotaulukon elementit:

"; for (i=0; i< Arr_Strings.length; i++){ the_arr_before_after += Arr_Strings[i] + "
"; ) document.getElementById("p1").innerHTML = the_arr_before_after; //Delete-funktiolla delete Arr_Strings; var the_arr_before_after = "Matriisielementit liitosmenetelmän jälkeen:

"; for (i=0; i< Arr_Strings.length; i++){ the_arr_before_after += Arr_Strings[i] + "
"; ) document.getElementById("p2").innerHTML = the_arr_fore_after;

Voit nähdä, että kolmas elementti näkyy määrittelemättömänä sen jälkeen, kun se on poistettu poistotoiminnolla.

JavaScript-kehittäjien keskuudessa on yleinen väärinkäsitys näiden kahden menetelmän välisestä erosta. Tiedätkö eron siivulla ja liitoksella?

Molemmat menetelmät on suunniteltu jakamaan JavaScript-joukko osiin, mutta jos ei ymmärretä, milloin slice- ja milloin liitoskohtaa käytetään, seurauksena on vaikea havaita virheitä. Tarkastellaan kutakin kahta menetelmää erikseen, niin ero tulee ilmeiseksi.

Viipaloi - leikkaa ja luo

Englanninkielinen verbi slice on käännetty "leikkaamaan". Ollakseni rehellinen, en ymmärrä, mitä määrittelyn kehittäjät ohjasivat, mutta et voi luottaa sanojen käännökseen JS:ssä. ECMAScript 5.1 -määrityksen mukaan slice-menetelmässä on kaksi argumenttia: alku- ja loppuindeksi. Sitten luodaan uusi taulukko, joka sisältää vanhan elementit aloitusindeksistä loppuhakemistoon. Tärkeintä on, että aina luodaan uusi taulukko, ts. matriisi, johon menetelmää sovellettiin, pysyy samana. Älä myöskään unohda, että toinen parametri ei määritä elementtien määrää, vaan loppuindeksiä, joten toisen parametrin on aina oltava suurempi kuin ensimmäinen, muuten palautetaan tyhjä taulukko. Katsotaanpa esimerkkejä.

Var a = ; console.log(a); // var b = a.slice(3, 5); console.log(a); // console.log(b); // var c = a.slice(4, 2); console.log(a); // console.log(c);//

Kuten tavallista JS:ssä, sinun on vain muistettava, että slice palauttaa sinulle määritetyn aloitusindeksin elementit (mukaan lukien itse elementti) määritettyyn loppuindeksiin, mutta ilman loppuelementtiä.

Jatko - leikkaus ja jakaminen

Englannin kielestä splice - liitos. Jälleen, verbin ja menetelmän toimintojen välillä ei ole yhteyttä. Suurin ero liitoksen kanssa on, että se muokkaa alkuperäistä taulukkoa. Menetelmä ottaa edelleen alku- ja loppuindeksin, mutta on tärkeää muistaa, että alkuperäinen taulukkosi menettää leikatut elementit.

Var a = ; console.log(a); // var b = a.splice(3, 5); console.log(a); // console.log(b); // var c = a.splice(4, 2); console.log(a); // console.log(c); //

Jälleen, sinun täytyy vain muistaa, että liitos katkaisee alkuperäisen taulukon määritetystä aloitusindeksistä (mukaan lukien itse elementti) määritettyyn loppuindeksiin (mukaan lukien itse elementin). Tässä tapauksessa menetelmä palauttaa kaikki leikatut elementit ja voit tallentaa ne erikseen.

Liitosmenetelmä on myös kätevä käyttää taulukon elementtien poistamiseen. Haluan muistuttaa, että tavallinen poistaa a; ei poista itse elementtiä, vaan asettaa sen määrittämättömäksi. Elementin poistamiseksi on parasta käyttää a.splice(1, 1);

Var a = ; poista a; console.log(a); // var a = ; a.splice(1, 1); console.log(a); //

Huomaan, että Google Chromen uusimmassa versiossa konsoli näyttää ensimmäisessä tapauksessa seuraavan tuloksen: . Todennäköisesti se ei yksinkertaisesti näyttänyt määrittelemätöntä elementtiä, koska itse asiassa poistoa ei tapahtunut.