Kod smartere! Bli en raskere, mer produktiv og fornøyd JavaScript-utvikler ved å lære deg disse sentrale og gjentakende funksjonene i språket.
Uansett om det er backend eller frontend (eller til og med romfartøy), er JavaScript overalt. Det er også et ganske fleksibelt språk (som betyr at det har både avanserte funksjonelle programmeringsmønstre og gode gamle klasser), og dets likhet med andre «C-lignende» språk gjør det enkelt for utviklere fra andre språk å bytte.
Hvis du ønsker å forbedre dine JS-ferdigheter, anbefaler jeg at du lærer om, øver på og til slutt mestrer de følgende kjernefunksjonene som er tilgjengelige i språket. Ikke alle disse er strengt tatt «nødvendige» for å løse problemer, men de kan gjøre mye tungt arbeid for deg i visse tilfeller, mens de i andre tilfeller kan redusere mengden kode du må skrive.
kart()
Det ville være en synd å skrive en artikkel om viktige JavaScript-funksjoner uten å nevne `map()`! 😆😆 Sammen med `filter()` og `reduce()`, utgjør `map()` en hellig treenighet. Dette er funksjoner du kommer til å bruke igjen og igjen i karrieren din, så det er vel verdt å se nærmere på dem. La oss ta for oss en av gangen, og vi starter med `map()`.
`map()` er blant funksjonene som skaper mest problemer for folk som lærer JavaScript. Hvorfor? Ikke fordi det er noe iboende komplekst med det, men fordi måten denne funksjonen fungerer på er en idé hentet fra det som kalles funksjonell programmering. Og siden vi ikke er vant til funksjonell programmering – skolene og industrien vår er fylt med objektorienterte språk – virker det rart eller til og med feil for våre forutinntatte hjerner.
JavaScript er langt mer funksjonelt enn objektorientert, selv om moderne versjoner gjør sitt beste for å skjule dette faktum. Men det er en helt annen sak jeg kanskje tar opp en annen dag. 🤣 Ok, så, `map()` . . .
`map()` er en veldig enkel funksjon; den henger seg på en matrise og hjelper oss med å konvertere hvert element til noe annet, noe som resulterer i en ny matrise. Hvordan man konverterer et element nøyaktig, er angitt som en annen funksjon, som vanligvis er anonym.
Det er alt som skal til! Syntaksen kan ta litt tid å venne seg til, men i hovedsak er det det vi gjør i en `map()`-funksjon. Hvorfor vil vi kanskje bruke `map()`? Det kommer an på hva vi prøver å oppnå. La oss for eksempel si at vi registrerte temperaturen for hver dag den siste uken og lagret den som en enkel matrise. Men nå blir vi fortalt at instrumentene ikke var særlig nøyaktige og har rapportert 1,5 grader lavere temperatur enn de burde ha.
Vi kan gjøre denne korreksjonen ved å bruke `map()`-funksjonen slik:
const ukentligeMålinger = [20, 22, 20.5, 19, 21, 21.5, 23]; const korrigerteUkentligeMålinger = ukentligeMålinger.map(måling => måling + 1.5); console.log(korrigerteUkentligeMålinger); // gir [ 21.5, 23.5, 22, 20.5, 22.5, 23, 24.5 ]
Et annet, veldig praktisk eksempel kommer fra React-verdenen, hvor det å lage DOM-elementlister fra matriser er et vanlig mønster; noe som dette er vanlig:
export default ({ produkter }) => {
return produkter.map(produkt => {
return (
<div className="produkt" key={produkt.id}>
<div className="p-navn">{produkt.navn}</div>
<div className="p-beskrivelse">{produkt.beskrivelse}</div>
</div>
);
});
};
Her har vi en funksjonell React-komponent som mottar en liste over produkter som props. Fra denne listen (matrisen) bygger den deretter en liste over HTML «divs», og konverterer i hovedsak hvert produkttobjekt til HTML. Det opprinnelige produkttobjektet forblir uendret.
Du kan argumentere for at `map()` ikke er annet enn en glorifisert for-løkke, og du vil ha helt rett. Men legg merke til at så snart du kommer med det argumentet, er det ditt objektorienterte trente sinn som snakker, mens disse funksjonene og deres begrunnelse kommer fra funksjonell programmering, hvor enhetlighet, kompakthet og eleganse er høyt aktet. 🙂
filter()
`filter()` er en svært nyttig funksjon som du vil oppdage at du bruker om og om igjen i mange situasjoner. Som navnet antyder, filtrerer denne funksjonen en matrise basert på reglene/logikken du oppgir, og returnerer en ny matrise som inneholder elementer som tilfredsstiller disse reglene.
La oss gjenbruke vårt væreksempel. Anta at vi har en matrise som inneholder maksimumstemperaturene for hver dag den forrige uken; nå ønsker vi å finne ut hvor mange av de dagene som var kaldere. Ja, «kaldere» er et subjektivt begrep, så la oss si at vi ser etter dager der temperaturen var under 20. Vi kan gjøre dette ved å bruke `filter()`-funksjonen slik:
const ukentligeMålinger = [20, 22, 20.5, 19, 21, 21.5, 23];
const kaldereDager = ukentligeMålinger.filter(dagTemperatur => {
return dagTemperatur < 20;
});
console.log("Totalt antall kalde dager i uken var: " + kaldereDager.length); // 1
Vær oppmerksom på at den anonyme funksjonen vi sender til `filter()` må returnere en boolsk verdi: `true` eller `false`. Dette er hvordan `filter()` vil vite om elementet skal inkluderes eller ikke i den filtrerte matrisen. Du står fritt til å skrive en hvilken som helst mengde kompleks logikk i denne anonyme funksjonen; du kan foreta API-kall og lese brukerinndata, og så videre, så lenge du sørger for at du til slutt returnerer en boolsk verdi.
Pass på: Dette er en sideanmerkning jeg føler meg tvunget til å komme med basert på min erfaring som JavaScript-utvikler. Enten det er på grunn av slurv eller feil grunnleggende, gjør mange programmerere subtile feil i programmene sine når de bruker `filter()`. La oss skrive om den forrige koden for å inkludere feilen:
const ukentligeMålinger = [20, 22, 20.5, 19, 21, 21.5, 23];
const kaldereDager = ukentligeMålinger.filter(dagTemperatur => {
return dagTemperatur < 20;
});
if(kaldereDager) {
console.log("Ja, det var kaldere dager forrige uke");
} else {
console.log("Nei, det var ingen kaldere dager");
}
Legger du merke til noe? Godt jobbet hvis du gjorde det! If-betingelsen mot slutten sjekker `kaldereDager`, som faktisk er en matrise! Du vil bli overrasket over hvor mange ganger folk gjør denne feilen mens de haster med å overholde tidsfrister eller koder i dårlig humør (uansett årsak). Problemet med denne betingelsen er at JavaScript er et rart og inkonsekvent språk på mange måter, og «sannheten» i ting er en av dem. Samtidig som `[] == true` returnerer usant, noe som får deg til å tro at koden ovenfor ikke er ødelagt, er realiteten at inne i en if-betingelse blir `[]` vurdert til sant! Med andre ord vil koden vi skrev aldri si at det ikke var noen kaldere dager forrige uke.
Rettelsen er veldig enkel, som vist i koden før koden ovenfor. Vi sjekker for `kaldereDager.length`, som garantert gir oss et heltall (null eller over) og dermed fungerer konsekvent i logiske sammenligninger. Merk at `filter()` alltid, alltid, alltid vil returnere en matrise, tom eller ikke-tom, så vi kan stole på det og skrive våre logiske sammenligninger trygt.
Det har vært en lengre omvei enn jeg hadde planlagt, men feil som denne er verdt å fremheve med ti tusen ord, med store bokstaver om nødvendig. Jeg håper du ikke blir bitt av dette og sparer deg selv for hundrevis av timer med feilsøking! 🙂
reduser()
Av alle funksjonene i denne artikkelen, så vel som i standard JavaScript-biblioteket, er `reduce()` en av de fremste kandidatene til tittelen «forvirrende og rar». Selv om denne funksjonen er svært viktig og resulterer i elegant kode i mange situasjoner, unngås den av de fleste JavaScript-utviklere, og de foretrekker å skrive mer detaljert kode i stedet.
Grunnen er – og jeg skal være ærlig her! – `reduce()` er vanskelig å forstå, både i betydningen konsept og utførelse. Når du leser beskrivelsen, har du lest den flere ganger og fortsatt tviler du på om du har lest den feil; og når du ser den i aksjon og prøver å visualisere hvordan den fungerer, snur hjernen din i tusen knop! 🤭
Nå, ikke bli redd. `reduce()`-funksjonen er ikke i nærheten av kompleksiteten og skremmende som for eksempel, B+ trær og deres algoritmer. Det er bare det at denne typen logikk sjelden oppstår under den gjennomsnittlige programmererens daglige arbeid.
Så etter å ha skremt vettet av deg, og deretter umiddelbart bedt deg om å ikke bekymre deg, vil jeg til slutt vise deg hva denne funksjonen er og hvorfor vi trenger den.
Som navnet antyder, brukes `reduce()` til å redusere noe. Tingen den reduserer er en matrise, og tingen den reduserer den gitte matrisen til er en enkelt verdi (tall, streng, funksjon, objekt, hva som helst). Her er en enklere måte å si det på – `reduce()` forvandler en matrise til en enkelt verdi. Merk at returverdien fra `reduce()` ikke er en matrise, noe som er tilfelle med `map()` og `filter()`. Å ha forstått så mye er halve kampen allerede. 🙂
Nå er det ganske åpenbart at hvis vi skal transformere (redusere) en matrise, må vi levere den nødvendige logikken; og basert på din erfaring som JS-utvikler, har du mest sannsynlig allerede gjettet at vi gjør det ved hjelp av en funksjon. Denne funksjonen er det vi kaller reduksjonsfunksjonen, som utgjør det første argumentet til `reduce()`. Det andre argumentet er en startverdi, for eksempel et tall, en streng osv. (Jeg skal forklare om litt hva i alle dager denne «startverdien» er).
Basert på vår forståelse så langt, kan vi si at et kall til `reduce()` ser slik ut: `array.reduce(reducerFunction, startingValue)`. La oss nå ta for oss kjernen i det hele: reduksjonsfunksjonen. Som allerede etablert, er reduksjonsfunksjonen det som forteller `reduce()` hvordan matrisen skal konverteres til en enkelt verdi. Den krever to argumenter: en variabel for å fungere som en akkumulator (ikke bekymre deg, jeg skal forklare denne biten også), og en variabel for å lagre gjeldende verdi.
Jeg vet, jeg vet . . . det var mye terminologi for en enkelt funksjon som ikke engang er obligatorisk i JavaScript. 😝😝 Og dette er grunnen til at folk flykter fra `reduce()`. Men hvis du lærer det trinn for trinn, vil du ikke bare forstå det, men også sette pris på det etter hvert som du blir en bedre utvikler.
Ok, så tilbake til det aktuelle emnet. «Startverdien» som sendes til `reduce()` er . . . vel, startverdien for beregningen du vil bruke. For eksempel, hvis du skal gjøre multiplikasjon i reduksjonsfunksjonen, er en startverdi på 1 fornuftig; for addisjon kan du starte med 0, og så videre.
La oss nå se på signaturen for reduksjonsfunksjonen. En reduksjonsfunksjon som sendes til `reduce()` har følgende form: `reducerFunction(akkumulator, gjeldende verdi)`. «Akkumulator» er bare et fancy navn for variabelen som samler og holder resultatet av beregningen; det er akkurat som å bruke en variabel kalt `total` for å summere alle elementene i en matrise ved å bruke noe som `total += arr[i]`. Dette er nøyaktig hvordan reduksjonsfunksjonen i `reduce()` blir brukt: Akkumulatoren settes først til startverdien du oppgir, og deretter besøkes elementene i matrisen ett etter ett, beregningen utføres, og resultatet lagres i akkumulatoren, og så videre. . .
Så, hva er denne «nåværende verdien» i en reduksjonsfunksjon? Det er den samme ideen som du mentalt ville forestilt deg hvis jeg ba deg krysse en matrise: du ville tatt en variabel for å starte på indeks null og flytte den frem et steg om gangen. Mens du gjør dette, hvis jeg ber deg om å stoppe plutselig, ville du befinne deg på et av elementene i matrisen, ikke sant? Dette er hva vi mener med gjeldende verdi: det er verdien av variabelen som brukes til å representere matriseelementet som for øyeblikket vurderes (tenk på å gå over en matrise hvis det hjelper).
Med alt det sagt, er det på tide å se et enkelt eksempel og se hvordan alt dette kommer sammen i et faktisk `reduce()`-kall. La oss si at vi har en matrise som inneholder de første n naturlige tallene (1, 2, 3 … n) og vi er interessert i å finne faktoren til n. Vi vet at for å finne n! trenger vi bare å multiplisere alt, noe som fører oss til denne implementeringen:
const tall = [1, 2, 3, 4, 5]; const faktorial = tall.reduce((akk, element) => akk * element, 1); console.log(faktorial); // 120
Det skjer mye i disse tre kodelinjene, så la oss pakke dem ut en etter en i sammenheng med den (veldig lange) diskusjonen vi har hatt til nå. Som det er åpenbart, er `tall` matrisen som inneholder alle tallene vi ønsker å multiplisere. Ta deretter en titt på `tall.reduce()`, som sier at startverdien for `akk` skal være 1 (fordi den ikke påvirker eller ødelegger noen multiplikasjon). Deretter sjekker du reduksjonsfunksjonen, `(akk, element) => akk * element`, som ganske enkelt sier at returverdien for hver iterasjon over matrisen skal være det elementet multiplisert med det som allerede er i akkumulatoren. Iterasjonen og den faktiske lagringen av multiplikasjonen eksplisitt i akkumulatoren er det som skjer bak kulissene, og er en av de største grunnene til at `reduce()` er en snublestein for JavaScript-utviklere.
Hvorfor bruke `reduce()`?
Det er et veldig godt spørsmål, og for å være ærlig har jeg ikke et sikkert svar. Uansett hva `reduce()` gjør, kan gjøres gjennom løkker, `forEach()` osv. Disse teknikkene resulterer imidlertid i mye mer kode, noe som gjør det vanskelig å lese, spesielt hvis du har det travelt. Så er det bekymringen for uforanderlighet: med `reduce()` og lignende funksjoner kan du være sikker på at de opprinnelige dataene dine ikke har blitt endret; dette i seg selv eliminerer hele klasser av feil, spesielt i distribuerte applikasjoner.
Til slutt er `reduce()` langt mer fleksibel, i den forstand at akkumulatoren kan være et objekt, en matrise eller til og med en funksjon om nødvendig; det samme gjelder for startverdien og andre deler av funksjonskallet – nesten alt kan gå inn, og nesten alt kan komme ut, så det er ekstrem fleksibilitet i å designe gjenbrukbar kode.
Hvis du fortsatt ikke er overbevist, er det også helt greit; JavaScript-fellesskapet i seg selv er delt i synet på «kompakthet», «elegans» og «kraften» til `reduce()`, så det er greit hvis du ikke bruker det. 🙂 Men sørg for å se på noen gode eksempler før du bestemmer deg for å droppe `reduce()`.
noen()
La oss si at du har en rekke objekter, der hvert objekt representerer en person. Du vil vite om det er noen personer i gruppen som er over 35 år. Merk at det ikke er nødvendig å telle hvor mange slike personer det er, enn si å hente en liste over dem. Det vi sier her tilsvarer «en eller flere» eller «minst en».
Hvordan gjør du dette?
Ja, du kan lage en flaggvariabel og løkke over matrisen for å løse dette problemet slik:
const personer = [
{
navn: 'Person 1',
alder: 32
},
{
navn: 'Person 2',
alder: 40
},
];
let funnetOver35 = false;
for (let i = 0; i < personer.length; i ++) {
if(personer[i].alder > 35) {
funnetOver35 = true;
break;
}
}
if(funnetOver35) {
console.log("Jada, det er et par mennesker her!")
}
Problemet? Koden er for C- eller Java-aktig, etter min mening. «Omstendelig» er et annet ord som dukker opp. Erfarne JS-utviklere tenker kanskje på «stygg», «forferdelig» osv. 😝 Og med rette, vil jeg påstå. En måte å forbedre denne koden på er å bruke noe som `map()`, men selv da er løsningen litt klønete.
Det viser seg at vi har en ganske fin funksjon kalt `some()` som allerede er tilgjengelig i kjernespråket. Denne funksjonen fungerer med matriser og godtar en tilpasset «filtrerings»-funksjon, og returnerer en boolsk verdi av `true` eller `false`. I hovedsak gjør den det vi har prøvd å gjøre de siste minuttene, bare veldig kortfattet og elegant. Slik kan vi bruke den:
const personer = [
{
navn: 'Person 1',
alder: 32
},
{
navn: 'Person 2',
alder: 40
},
];
if(personer.some(person => {
return person.alder > 35
})) {
console.log("Fant noen folk!")
}
Samme input, samme resultat som før; men legg merke til den enorme reduksjonen i kode! Legg også merke til hvor drastisk den kognitive belastningen reduseres fordi vi ikke lenger trenger å analysere koden linje for linje som om vi var tolken selv! Koden leser nå nesten som naturlig språk.
hver()
Akkurat som `some()`, har vi en annen nyttig funksjon kalt `every()`. Som du kan gjette nå, returnerer også denne en boolsk verdi avhengig av om alle elementene i matrisen består den gitte testen. Selvfølgelig leveres testen for å bestå som en anonym funksjon mesteparten av tiden. Jeg skal spare deg for smerten med hvordan en naiv versjon av koden kan se ut, så her er hvordan `every()` brukes:
const oppføringer = [
{
id: 1
},
{
id: 2
},
{
id: 3
},
];
if(oppføringer.every(oppføring => {
return Number.isInteger(oppføring.id) && oppføring.id > 0;
})) {
console.log("Alle oppføringene har en gyldig id")
}
Som det er åpenbart, sjekker koden alle objektene i matrisen for en gyldig id-egenskap. Definisjonen av «gyldig» avhenger av problemkonteksten, men som du kan se, for denne koden vurderte jeg ikke-negative heltall. Nok en gang ser vi hvor enkel og elegant koden er å lese, som er hele poenget med denne (og lignende) funksjoner.
inkluderer()
Hvordan sjekker du om det finnes understrenger og matriseelementer? Vel, hvis du er som meg, tyr du raskt til `indexOf()` og slår deretter opp dokumentene for å gjøre deg kjent med mulige returverdier. Det er en betydelig ulempe, og returverdiene er vanskelige å huske (raskt – hva betyr en prosess som returnerer 2 til operativsystemet?).
Men det er et fint alternativ som vi kan bruke: `includes()`. Bruken er like enkel som navnet, og den resulterende koden er ekstremt hjertevarmende. Husk at matchingen som gjøres av `includes()` skiller mellom store og små bokstaver, men jeg antar at det er det vi alle intuitivt forventer uansett. Og nå er det tid for litt kode!
const tall = [1, 2, 3, 4, 5];
console.log(tall.includes(4));
const navn = "Ankush";
console.log(navn.includes('ank')); // false, fordi første bokstav er med små bokstaver
console.log(navn.includes('Ank')); // true, som forventet
Men ikke forvent for mye av denne ydmyke metoden:
const bruker = {a: 10, b: 20};
console.log(bruker.includes('a')); // eksploderer, siden objekter ikke har en "includes"-metode
Den kan ikke se på innsiden av objekter, siden den rett og slett ikke er definert for objekter. Men hei, vi vet at den fungerer på matriser, så kanskje vi kan gjøre noe lureri her . . . 🤔.
const personer = [{navn: 'Phil'}, {navn: 'Jane'}];
personer.includes({navn: 'Phil'});
Så, hva skjer når du kjører denne koden? Den eksploderer ikke, men resultatet er også skuffende: false. 😫😫 Faktisk har dette å gjøre med objekter, pekere og hvordan JavaScript ser og administrerer minne, som er en helt annen verden. Hvis du ønsker å dykke dypere, ta gjerne steget (kanskje start her), men jeg stopper her.
Vi kan få koden ovenfor til å oppføre seg hvis vi skriver den om som følger, men på dette tidspunktet blir det mer eller mindre en vits, etter min mening:
const phil = {navn: 'Phil'};
const personer = [phil, {navn: 'Jane'}];
personer.includes(phil); // true
Likevel viser det at vi kan få `includes()` til å fungere på objekter, så jeg antar at det ikke er en total katastrofe. 😄
slice()
Anta at vi har en streng, og jeg ber deg returnere en del av den som starter med «r» og slutter med «z» (de faktiske tegnene er ikke viktige). Hvordan vil du nærme deg det? Kanskje du vil lage en ny streng og bruke den til å lagre alle nødvendige tegn og returnere dem. Eller hvis du er som de fleste programmerere, vil du gi meg to matriseindekser i retur: en som indikerer starten på understrengen, den andre markerer slutten.
Begge disse tilnærmingene er fine, men det er et konsept som kalles slicing som tilbyr en fin løsning i slike situasjoner. Heldigvis er det ingen abstrakt teori å følge; slicing betyr akkurat det det høres ut som – å lage en mindre streng/matrise fra den gitte, omtrent som vi lager skiver av frukt. La oss se hva jeg mener, ved hjelp av et enkelt eksempel:
const overskrift = "Og i kveldens spesial, gjesten vi alle har ventet på!";
const startIndeks = overskrift.indexOf('gjest');
const sluttIndeks = overskrift.indexOf('venter');
const nyOverskrift = overskrift.slice(startIndeks, sluttIndeks);
console.log(nyOverskrift); // gjest vi alle har
Når vi bruker `slice()`, gir vi to indekser til JavaScript – den ene der vi vil starte slicingen, og den andre der vi vil at den skal stoppe. Haken med `slice()` er at sluttindeksen ikke er inkludert i det endelige resultatet, og det er derfor vi ser at ordet «venter» mangler i den nye overskriften i koden ovenfor.
Konsepter som slicing er mer fremtredende på andre språk, spesielt Python. Hvis du spør disse utviklerne, vil de si at de ikke kan forestille seg livet uten denne funksjonaliteten, og med rette når språket gir en veldig fin syntaks for slicing.
Slicing er pent og ekstremt praktisk, og det er ingen grunn til å ikke bruke det. Det er heller ikke syntaks-sukker som er full av ytelsesstraff, da det skaper grunne kopier av den opprinnelige matrisen/strengen. For JavaScript-utviklere anbefaler jeg på det sterkeste å bli kjent med `slice()` og legge den til i arsenalet ditt!
splice()
Metoden `splice()` høres ut som en fetter av `slice()`, og på noen måter kan vi argumentere for at den er det. Begge lager nye matriser/strenger fra de opprinnelige, med en liten, men viktig forskjell – `splice()` fjerner, endrer eller legger til elementer, men endrer den opprinnelige matrisen. Denne «ødeleggelsen» av den opprinnelige matrisen kan skape store problemer hvis du ikke er forsiktig eller ikke forstår dype kopier og referanser. Jeg lurer på hva som stoppet utviklerne fra å bruke samme tilnærming som for `slice()` og la den opprinnelige matrisen være uendret, men jeg antar at vi kan være mer tilgivende overfor et språk som ble laget på bare ti dager.
Til tross for mine klager, la oss ta en titt på hvordan `splice()` fungerer. Jeg skal vise et eksempel der vi fjerner noen få elementer fra en matrise, da dette er den vanligste bruken du finner for denne metoden. Jeg vil også avstå fra å gi eksempler på tillegg og innsetting fordi disse lett kan slås opp og er enkle også.
const varer = ['egg', 'melk', 'ost', 'brød', 'smør']; varer.splice(2, 1); console.log(varer); // [ 'egg', 'melk', 'brød', 'smør' ]
Kallingen til `splice()` ovenfor sier: start på indeks 2 (den tredje plassen, altså) i matrisen, og fjern ett element. I den gitte matrisen er «ost» det tredje elementet, så det fjernes fra matrisen og matrisen av elementer forkortes, som forventet. Forresten, elementene som er fjernet returneres av `splice()` i form av en matrise, så hvis vi ønsket det, kunne vi ha fanget «ost» i en variabel.
Etter min erfaring har `indexOf()` og `splice()` stor synergi – vi finner indeksen til et element og fjerner det deretter fra den gitte matrisen. Vær imidlertid oppmerksom på at det ikke alltid er den mest effektive metoden, og ofte er det mye raskere å bruke et objekt (tilsvarer et hash-kart).
skift()
`shift()` er en slags bekvemmelighetsmetode og brukes til å fjerne det første elementet i en matrise. Legg merke til at det samme kan gjøres med `splice()`, men `shift()` er litt lettere å huske og intuitivt når alt du trenger å gjøre er å kutte av det første elementet.
const varer = ['egg', 'melk', 'ost', 'brød', 'smør']; varer.shift() console.log(varer); // [ 'melk', 'ost', 'brød', 'smør' ]
unshift()
Akkurat som `shift()` fjerner det første elementet fra en matrise, legger `unshift()` til et nytt element i starten av matrisen. Bruken er like enkel og kompakt:
const varer = ['egg', 'melk'];
varer.unshift('brød')
console.log(varer); // [ 'brød', 'egg', 'melk' ]
Når det er sagt, kan jeg ikke dy meg og advare de som er nye i gamet: i motsetning til de populære `push()`- og `pop()`-metodene, er `shift()` og `unshift()` ekstremt ineffektive (på grunn av måten de underliggende algoritmene fungerer på). Så hvis du opererer på store matriser (for eksempel 2000+ elementer), kan for mange av disse funksjonskallene stoppe applikasjonen din.
fyll()
Noen ganger må du endre flere elementer til en enkelt verdi eller til og med «tilbakestille» hele matrisen, for å si det sånn. I disse situasjonene sparer `fill()` deg for løkker og av-for-en-feil. Den kan brukes til å erstatte deler av eller hele matrisen med den gitte verdien. La oss se et par eksempler:
const høyder = [1, 2, 4, 5, 6, 7, 1, 1]; høyder.fill(0); console.log(høyder); // [0, 0, 0, 0, 0, 0, 0, 0] const høyder2 = [1,