Alla JavaScript Array Method

author
5 minutes, 47 seconds Read

ES6 Methods

ES6

ES6, som är en förkortning av ECMAScript 6, är den version av JavaScript som släpptes i juni 2015. Det verkar som om de utvecklare som underhåller JavaScript gillar min födelsemånad eftersom det var då de flesta av deras versioner släpptes.

Om du precis har börjat lära dig JavaScript kommer ES6 att göra livet mycket enklare för dig. Den tillhandahåller inte bara arraymetoder, utan också saker som destrukturering, pilfunktioner, ett bättre sätt att skriva objektorienterad och modulär kod, bland annat.

De flesta av dessa ES6-arraymetoder tar en callback-funktion, och som ett resultat av detta kallas de för arraymetoder av högre ordning. Arrow-funktioner är mycket vanliga i funktioner av högre ordning, eftersom det förenklar vår kod

Map-metoden

Om det finns någon ES6-arraymetod som du kommer att använda nästan hela tiden så är det den här metoden. Det är min bästa arraymetod både i JavaScript och Python. Även om vissa JavaScript-utvecklare har försökt implementera map före ES6 infördes standardmetoden map i JavaScript i ES6. I kodutdraget nedan har jag implementerat map på tre sätt:

  • Med hjälp av vanliga JavaScript-funktioner: Här skickade jag två argument till funktionen, först item, som är elementet jag vill göra något på, och ett valfritt argument, index, som är indexet för varje element
  • Med hjälp av pilfunktioner: Jag använde också två argument precis som i det första exemplet, men callback-funktionen här är en pilfunktion, vilket gör koden mycket snyggare.
  • Jag använde också pilfunktioner, men jag lämnade bara ett argument – det element som jag vill iterera på. Detta är användbart om jag inte behöver indexet.

Filtermetoden

Metoden filter är en annan array-metod av högre ordning som du bör använda idag. Vad filter gör är enkelt. Givet en array med element vill vi återge en ny array från den ursprungliga arrayen, där ett visst villkor är true. Callback-funktionen måste returnera ett boolska, och det element som lyder villkoret är det som kommer att finnas i den nya matrisen.

Metoden reducera

Det här är väldigt trevligt, och jag tror att det är den svåraste av alla de metoder som jag har nämnt hittills. Vad den här metoden gör är att använda en viss callback för att reducera arrayen. Om jag till exempel vill hitta summan av alla element i en array eller produkten av alla element i en array är den här metoden en trevlig metod att använda, istället för att slinga och öka den ursprungliga summan eller produkten.

Metoden forEach

Den här metoden liknar metoden map, men i det här fallet returnerar den inte en ny array. Det är mer av den vanliga for-slingan i JavaScript men på ett renare och mer avancerat sätt. Den tar tre parametrar, som du kanske vet. Den första är elementet i arrayen, den andra är elementets index (vilket är valfritt) och den tredje är det arrayobjekt som det aktuella elementet tillhör.

I kodutklippet nedan använde jag forEach för att manipulera Document Object Model (DOM), vilket är ganska coolt. Jag kan uppdatera arrayen och de listelement som återges i DOM ändras automatiskt.

Metoden concat

Det finns fall där du vill sammanfoga eller slå ihop två eller flera arrayer. Då kommer den här funktionen att vara mycket praktisk. Om man anropar concat på två matriser får man en ny matris som består av de två matriserna tillsammans.

Metoderna every och some

De här metoderna är användbara om du vill veta om alla element i en matris klarar ett villkor respektive om några av elementen i en matris klarar ett villkor.

Andra metoder inkluderar:

Metoden fill

Fyller varje element i matrisen med ett värde som skickas som parameter: .fill(1) // .

Metoden entries

Detta får arrayen att bete sig som ett objekt med ett nyckel-värdepar, där nyckeln är indexet och värdet är elementet.

Metoden find

Denna metod returnerar det första elementet i en array som klarar ett test. Den tar en callback-funktion, som returnerar ett boolean.

The splice method

Denna metod tar ett oändligt antal parametrar – de två första är indexet där du vill börja infoga och ta bort element respektive antalet element som du vill ta bort – och de återstående parametrarna är de element som du vill lägga till i matrisen. Den returnerar en array med de element som tas bort och muterar arrayen.

The reverse method

The reverse method reverserar arrayen. Observera att den muterar den, vilket innebär att den ändrar arrayen i stället för att bara skapa en kopia av den.

Den sammanfogade metoden

Den här metoden omvandlar en array till en array till en sträng. Observera att den inte muterar arrayen – den skapar bara en kopia av den. Motsatsen till den här metoden är split-metoden, som förvandlar en sträng till en array. Den tar en sträng som parameter, vilket är vad som kommer att användas för att sammanfoga varje element i matrisen.

Den platta metoden

Metoden flat är en ny metod som lades till i ES11 (ES11 skapades i juni i år). Den här metoden plattar ut en matris.

Vad sägs om att vi har en matris som innehåller en matris, och vi vill hitta summan och produkten av varje element i matriserna inuti matrisen. Vad jag menar är att om jag har en array som definieras av , ] ska summan vara 10 och produkten ska vara 24.

Ett sätt att gå tillväga är att slinga sig igenom den inledande arrayen och slinga sig igenom varje element för att få fram summan och produkten.

Med ES6 kan jag slinga mig igenom den inledande arrayen och använda reduce-metoden för att få fram summan och produkten av varje element i huvudarrayn – och använda det för att få fram den totala summan och produkten. Men med flat-matrisen kan jag platta huvudmatrisen och på så sätt återge en enda matris som bara innehåller siffror, och jag kan använda reduce-metoden på den.

Metoden flatMap

Detta är kombinationen av flat och map. Den mappar varje element i matrisen till en given callback-funktion och plattar sedan den resulterande matrisen.

Då säger vi att vi vill få fram kvadraten på varje element i en icke-plattad matris, och att vi vill platta den. Den här metoden kommer att göra livet enklare för oss. I den del där jag använde flatMap-metoden i kodutdraget nedan tar den ett element som är en array, och jag returnerade en ny array, som är kvadraten av elementen. Och slutligen plattar den den resulterande matrisen.

Similar Posts

Lämna ett svar

Din e-postadress kommer inte publiceras.