Topp 11 (och fler!) måste-känna JavaScript-funktioner

av

Kod smart! Bli en snabbare, mer produktiv och gladare JavaScript-utvecklare genom att behärska dessa viktigaste och återkommande funktioner på språket.

Oavsett om det är backend eller frontend (eller till och med rymdskepp), JavaScript finns överallt. Det är också ett ganska flexibelt språk (vilket innebär att det har hårda funktionella programmeringsmönster såväl som bra gamla klasser), och dess likhet med andra ”C-liknande” språk gör det enkelt för utvecklare att övergå från andra språk.

Om du vill nivå upp ditt JS-spelJag föreslår att du lär dig om, övar på och så småningom behärskar följande kärnfunktioner som är tillgängliga på språket. Alla dessa ”behövs” inte strikt för att lösa problem, men de kan göra mycket tunga lyft för dig i vissa fall, medan i andra kan dessa minska mängden kod du måste skriva.

Karta()

Det skulle vara kätteri att skriva en artikel om viktiga JavaScript-funktioner och inte nämna map()! 😆😆 Tillsammans med filter() och reduce() bildar map() en helig treenighet av olika slag. Det här är funktioner du kommer att använda om och om igen i din karriär, så de är mer än värda en titt. Låt oss ta itu med dem en efter en, börja med map().

map() är bland de funktioner som gör det svårast för människor att lära sig JavaScript. Varför? Inte för att det är något i sig komplicerat med det, utan för att hur den här funktionen fungerar är en idé hämtad från det som kallas Funktionell programmering. Och eftersom vi inte utsätts för funktionell programmering – våra skolor och branschen är full av objektorienterade språk – verkar arbetet konstigt eller till och med fel för våra partiska hjärnor.

JavaScript är mycket mer funktionellt än objektorienterat, även om dess moderna versioner gör sitt bästa för att dölja detta faktum. Men det är en hel burk med maskar som jag kanske kan öppna någon annan dag. 🤣 Okej, så, map() . . .

map() är en mycket enkel funktion; den ansluter sig till en array och hjälper oss att omvandla varje objekt till något annat, vilket resulterar i en ny array. Hur man konverterar ett objekt exakt tillhandahålls som en annan funktion, som enligt konventionen är anonym.

Det är allt som finns! Syntaxen kan ta lite tid att vänja sig vid, men i huvudsak är det vad vi gör i en map()-funktion. Varför skulle vi vilja använda map()? Beror på vad vi försöker uppnå. Låt oss till exempel säga att vi registrerade temperaturen för varje dag under den senaste veckan och lagrade den som en enkel array. Men nu får vi veta att instrumenten inte var särskilt exakta och har rapporterat 1,5 grader lägre temperatur än de borde ha gjort.

Vi kan göra denna korrigering med funktionen map() så här:

const weeklyReadings = [20, 22, 20.5, 19, 21, 21.5, 23];

const correctedWeeklyReadings = weeklyReadings.map(reading => reading + 1.5);

console.log(correctedWeeklyReadings); // gives [ 21.5, 23.5, 22, 20.5, 22.5, 23, 24.5 ]

Ett annat, mycket praktiskt, exempel kommer från världen av React, där att skapa DOM-elementlistor från arrayer är ett vanligt mönster; så något sådant här är vanligt:

export default ({ products }) => {
    return products.map(product => {
        return (
            <div className="product" key={product.id}>
                <div className="p-name">{product.name}</div>
                <div className="p-desc">{product.description}</div>
            </div>
        );
    });
};

Här har vi en funktionell React-komponent som får en lista över produkter som rekvisita. Från denna lista (array) bygger den sedan ut en lista med HTML ”divs”, vilket i huvudsak konverterar varje produktobjekt till HTML. Det ursprungliga produktobjektet förblir orört.

Du kan hävda att map() inte är något annat än en glorifierad för loop och du skulle ha helt rätt. Men lägg märke till att så fort du framför det argumentet är det ditt objektorienterade tränade sinne som talar, medan dessa funktioner och deras logik kommer från funktionell programmering, där enhetlighet, kompakthet och elegans är mycket vördade. 🙂

filtrera()

filter() är en mycket användbar funktion som du kommer att finna att du använder om och om igen i många situationer. Som namnet antyder filtrerar den här funktionen en array baserat på reglerna/logiken du tillhandahåller och returnerar en ny array som innehåller objekt som uppfyller dessa regler.

Låt oss återanvända vårt väderexempel. Antag att vi har en array som innehåller maxtemperaturerna för varje dag i förra veckan; nu vill vi ta reda på hur många av dessa dagar som var kallare. Ja, ”kallare” är en subjektiv term, så låt oss säga att vi letar efter dagar där temperaturen var under 20. Vi kan göra detta med hjälp av filter()-funktionen så här:

const weeklyReadings = [20, 22, 20.5, 19, 21, 21.5, 23];

const colderDays = weeklyReadings.filter(dayTemperature => {
    return dayTemperature < 20;
});

console.log("Total colder days in week were: " + colderDays.length); // 1

Observera att den anonyma funktionen vi skickar till filter() måste returnera ett booleskt värde: true eller false. Det här är hur filter() kommer att veta om objektet ska inkluderas i den filtrerade arrayen eller inte. Du är fri att skriva vilken mängd komplex logik som helst i denna anonyma funktion; du kan göra API-anrop och läsa användarinmatningar och så vidare, så länge du ser till att du i slutändan returnerar ett booleskt värde.

Se upp: Detta är en sidoanteckning som jag känner mig tvungen att tillhandahålla baserat på min erfarenhet som JavaScript-utvecklare. Oavsett om det beror på slarv eller felaktiga grunder, skapar många programmerare subtila buggar i sina program när de använder filter(). Låt oss skriva om den föregående koden så att den innehåller buggen:

const weeklyReadings = [20, 22, 20.5, 19, 21, 21.5, 23];

const colderDays = weeklyReadings.filter(dayTemperature => {
    return dayTemperature < 20;
});

if(colderDays) {
    console.log("Yes, there were colder days last week");
} else {
    console.log("No, there were no colder days");
}

Lägg märke till något? Bra jobbat om du gjorde det! Om-villkoret mot slutet kontrollerar colderDays, vilket faktiskt är en array! Du kommer att bli förvånad över hur många gånger människor gör detta misstag när de tävlar för att hålla deadlines eller kodifiera med låg humör (av vilken anledning som helst). Problemet med detta tillstånd är att JavaScript är ett konstigt och inkonsekvent språk på många sätt, och ”sanningen” i saker är en av dem. Medan [] == true returnerar falskt, vilket får dig att tro att ovanstående kod inte är trasig, verkligheten är att inuti ett if-villkor, [] bedöms till sant! Med andra ord kommer koden vi skrev aldrig att säga att det inte var några kallare dagar förra veckan.

Fixningen är mycket enkel, som anges i koden före ovanstående kod. Vi kollar efter colderDays.length, som garanterat ger oss ett heltal (noll eller högre) och arbetar därmed konsekvent i logiska jämförelser. Observera att filter() alltid, alltid, alltid kommer att returnera en array, tom eller icke-tom, så vi kan lita på det och skriva våra logiska jämförelser med tillförsikt.

Det har varit en längre omväg än jag planerat, men sådana buggar som denna är värda att lyfta fram med tiotusen ord, med stora och små bokstäver om det behövs. Jag hoppas att du inte blir biten av detta och sparar dig hundratals timmar av felsökning! 🙂

minska()

Av alla funktioner i den här artikeln, såväl som i det vanliga JavaScript-biblioteket, är reduce() en av de främsta för kronorna av ”förvirrande och konstigt”. Även om den här funktionen är mycket viktig och resulterar i elegant kod i många situationer, undviks den av de flesta JavaScript-utvecklare och de föredrar att skriva mer utförlig kod istället.

Anledningen är att – och jag ska vara ärlig här! — reduce() är svårt att förstå, i betydelsen både koncept och utförande. När du läser dess beskrivning har du läst om den flera gånger och fortfarande tvivlar du på dig själv om du läst den fel; och när du ser det i aktion och försöker visualisera hur det fungerar, vrids din hjärna till tusen knop! 🤭

Nu, bli inte rädd. Funktionen reduce() är inte i närheten av komplexitet och skrämsel, säg, B+ Träd och deras algoritmer. Det är bara det att den här typen av logik sällan stöter på under den genomsnittliga programmerarens dagliga jobb.

Så, efter att ha skrämt dagsljuset ur dig och sedan omedelbart sagt åt dig att inte oroa dig, skulle jag äntligen vilja visa dig vad den här funktionen är och exakt varför vi kan behöva den.

Som namnet antyder används reduce() för att, ja, reducera något. Saken den reducerar är en array och saken den reducerar den givna arrayen till är ett enda värde (tal, sträng, funktion, objekt, vad som helst). Här är ett enklare sätt att uttrycka det – reduce() omvandlar en array till ett enda värde. Observera att returvärdet från reduce() inte är en array, vilket är fallet med map() och filter(). Att ha förstått så mycket är halva striden redan. 🙂

Nu är det ganska uppenbart att om vi ska transformera (minska) en array måste vi tillhandahålla den nödvändiga logiken; och baserat på din erfarenhet som JS-utvecklare, har du mest gillat redan gissat att vi gör det med en funktion. Denna funktion är vad vi kallar reducerfunktionen, som utgör det första argumentet för reduce(). Det andra argumentet är ett startvärde, såsom ett tal, en sträng, etc. (jag ska förklara om ett tag vad fan detta ”startvärde” är).

Baserat på vår förståelse hittills kan vi säga att ett anrop till reduce() ser ut så här: array.reduce(reducerFunction, startingValue). Låt oss nu ta itu med hjärtat av det hela: reduceringsfunktionen. Som redan fastställts är reduceringsfunktionen det som talar om för reduce() hur man konverterar matrisen till ett enda värde. Det krävs två argument: en variabel för att fungera som en ackumulator (var inte orolig, jag ska förklara den här biten också), och en variabel för att lagra det aktuella värdet.

Jag vet jag vet . . . det var mycket terminologi för en enda funktion som inte ens är obligatorisk i JavaScript. 😝😝 Och det är därför folk flyr från reduce(). Men om du lär dig det steg-för-steg kommer du inte bara att förstå det utan också uppskatta det när du blir en bättre utvecklare.

Okej, så, tillbaka till det aktuella ämnet. ”Startvärdet” som skickas till reduce() är . . . ja, startvärdet för beräkningen du vill använda. Till exempel, om du ska göra multiplikation i reduceringsfunktionen, är ett startvärde på 1 vettigt; för tillägg kan du börja med 0, och så vidare.

Låt oss nu titta på signaturen för reduceringsfunktionen. En reducerfunktion som skickas till reduce() har följande form: reducerFunction(accumulator, currentValue). ”Accumulator” är bara ett fancy namn för variabeln som samlar in och håller resultatet av beräkningen; det är precis som att använda en variabel som heter total för att summera alla objekt i en array med något som total += arr[i]. Det är precis så här reduceringsfunktionen i reduce() tillämpas: ackumulatorn ställs initialt till startvärdet du anger, och sedan besöks elementen i arrayen ett efter ett, beräkningen utförs och resultatet lagras i ackumulatorn och så vidare. . .

Så, vad är detta ”aktuella värde” i en reducerfunktion? Det är samma idé som du mentalt skulle föreställa dig om jag ber dig att korsa en array: du skulle ta en variabel för att börja på index noll och flytta den framåt ett steg i taget. Medan du gör det här, om jag ber dig att plötsligt sluta, skulle du befinna dig på ett av elementen i arrayen, eller hur? Det här är vad vi menar med aktuellt värde: det är värdet på variabeln som används för att representera arrayobjektet som för närvarande övervägs (tänk på att loopa över en array om det hjälper).

Med allt detta sagt, är det dags att se ett enkelt exempel och se hur all denna jargong kommer samman i ett verkligt reduce()-anrop. Låt oss säga att vi har en matris som innehåller de första n naturliga talen (1, 2, 3 … n) och vi är intresserade av att hitta faktorialen för n. Vi vet att hitta n! vi behöver helt enkelt multiplicera allt, vilket leder oss till denna implementering:

const numbers = [1, 2, 3, 4, 5];
const factorial = numbers.reduce((acc, item) => acc * item, 1);
console.log(factorial); // 120

Mycket händer i dessa bara tre rader kod, så låt oss packa upp det en efter en i samband med den (mycket långa) diskussion vi har haft hittills. Som är uppenbart är siffror den matris som innehåller alla siffror vi vill multiplicera. Ta sedan en titt på anropet numbers.reduce(), som säger att startvärdet för acc ska vara 1 (eftersom det inte påverkar eller förstör någon multiplikation). Kontrollera sedan reducerfunktionskroppen, `(acc, item) => acc * item, som helt enkelt säger att returvärdet för varje iteration över arrayen ska vara det objektet multiplicerat med det som redan finns i ackumulatorn. Iterationen och att faktiskt lagra multiplikationen explicit i ackumulatorn är vad som händer bakom kulisserna, och är en av de största anledningarna till att reduce() är en sådan stötesten för JavaScript-utvecklare.

Varför använda reduce()?

Det är en riktigt bra fråga och om jag ska vara ärlig så har jag inget säkert svar. Vad reduce() än gör kan göras genom loopar, forEach(), etc. Men dessa tekniker resulterar i mycket mer kod, vilket gör det svårt att läsa, speciellt om du har bråttom. Sedan finns det oron för oföränderlighet: med reduce() och liknande funktioner kan du vara säker på att dina ursprungliga data inte har muterats; detta i sig eliminerar hela klasser av buggar, särskilt i distribuerade applikationer.

Slutligen är reduce() mycket mer flexibel, i den meningen att ackumulatorn kan vara ett objekt, en array eller till och med en funktion om det behövs; detsamma gäller för startvärdet och andra delar av funktionsanropet — nästan vad som helst kan komma in, och nästan vad som helst kan komma ut, så det finns extrem flexibilitet i att designa återanvändbar kod.

Om du fortfarande inte är övertygad är det också helt okej; JavaScript-gemenskapen i sig är skarpt uppdelad över ”kompakthet”, ”elegans” och ”kraft” hos reduce(), så det är okej om du inte använder det. 🙂 Men se till att du tittar på några snygga exempel innan du bestämmer dig för att bin reduce().

några()

Låt oss säga att du har en rad objekt, där varje objekt representerar en person. Du vill veta om det finns personer i gruppen som är över 35 år. Observera att det inte finns något behov av att räkna hur många sådana personer är, än mindre hämta en lista över dem. Det vi säger här är motsvarigheten till ”en eller flera” eller ”minst en”.

Hur gör du det här?

Ja, du kan skapa en flaggvariabel och loopa över arrayen för att lösa det här problemet så här:

const persons = [
    {
        name: 'Person 1',
        age: 32
    },
    
    {
        name: 'Person 2',
        age: 40
    },
];

let foundOver35 = false;

for (let i = 0; i < persons.length; i ++) {
    if(persons[i].age > 35) {
        foundOver35 = true;
        break;
    }
}

if(foundOver35) {
    console.log("Yup, there are a few people here!")
}

Problemet? Koden är för C-liknande eller Java-liknande, enligt mig. ”Verbose” är ett annat ord som kommer att tänka på. Erfaren JS kanske tänker på ”ful”, ”hemsk” etc. 😝 Och med rätta, skulle jag vilja hävda. Ett sätt att förbättra denna kodbit är att använda något som map(), men även då är lösningen lite klumpig.

Det visar sig att vi har en ganska snygg funktion som heter some() som redan är tillgänglig på huvudspråket. Den här funktionen arbetar med matriser och accepterar en anpassad ”filtreringsfunktion”, som returnerar ett booleskt värde på sant eller falskt. I huvudsak gör det vad vi har försökt göra de senaste minuterna, bara mycket kortfattat och elegant. Så här kan vi använda det:

const persons = [
    {
        name: 'Person 1',
        age: 32
    },
    
    {
        name: 'Person 2',
        age: 40
    },
];

if(persons.some(person => {
    return person.age > 35
})) {
    console.log("Found some people!")
}

Samma input, samma resultat som tidigare; men lägg märke till den enorma minskningen av kod! Lägg också märke till hur drastiskt den kognitiva bördan minskar eftersom vi inte längre behöver analysera koden rad för rad som om vi själva vore tolken! Koden läser nu nästan som ett naturligt språk.

varje()

Precis som some() har vi en annan användbar funktion som heter every(). Som du kan gissa vid det här laget returnerar även detta ett booleskt värde beroende på om alla objekt i arrayen klarar det givna testet. Självklart tillhandahålls testet för att klara som en anonym funktion för det mesta. Jag ska bespara dig smärtan med hur en naiv version av koden kan se ut, så här är hur every() används:

const entries = [
    {
        id: 1
    },
    
    {
        id: 2
    },
    
    {
        id: 3  
    },
];

if(entries.every(entry => {
    return Number.isInteger(entry.id) && entry.id > 0;
})) {
    console.log("All the entries have a valid id")
}

Som är uppenbart kontrollerar koden alla objekt i arrayen för en giltig id-egenskap. Definitionen av ”giltig” beror på problemkontexten, men som du kan se, för den här koden, ansåg jag icke-negativa heltal. Återigen ser vi hur enkel och elegant koden är att läsa, vilket är det enda syftet med denna (och liknande) funktion(er).

inkluderar()

Hur kontrollerar du om det finns delsträngar och arrayelement? Tja, om du är som jag, sträcker du dig snabbt efter indexOf() och slår sedan upp dokumenten för att få dig att veta dess möjliga returvärden. Det är ett stort besvär och returvärdena är svåra att komma ihåg (snabbt – vad betyder en process som returnerar 2 till operativsystemet?).

Men det finns ett bra alternativ som vi kan använda oss av: include(). Användningen är lika enkel som namnet, och den resulterande koden är extremt hjärtvärmande. Tänk på att matchningen görs av include() är skiftlägeskänslig, men jag antar att det är vad vi alla intuitiva förväntar oss i alla fall. Och nu är det dags för lite kod!

const numbers = [1, 2, 3, 4, 5];
console.log(numbers.includes(4));
const name = "Ankush";
console.log(name.includes('ank')); // false, because first letter is in small caps
console.log(name.includes('Ank')); // true, as expected

Men förvänta dig inte för mycket av denna ödmjuka metod:

const user = {a: 10, b: 20};
console.log(user.includes('a')); // blows up, as objects don't have a "includes" method

Det kan inte titta inuti objekt eftersom det helt enkelt inte är definierat för objekt. Men hey, vi vet att det fungerar på arrayer, så vi kanske kan göra lite knep här . . . 🤔.

const persons = [{name: 'Phil'}, {name: 'Jane'}];
persons.includes({name: 'Phil'});

Så vad händer när du kör den här koden? Det exploderar inte, men resultatet är också en besvikelse: falskt. 😫😫 Egentligen har detta att göra med objekt, pekare och hur JavaScript ser och hanterar minne, vilket är en egen värld. Om du vill dyka djupare, ta gärna steget (kanske börja här), men jag slutar här.

Vi kan få ovanstående kod att bete sig om vi skriver om den enligt följande, men vid det här laget blir det mer eller mindre ett skämt, enligt min mening:

const phil = {name: 'Phil'};
const persons = [phil, {name: 'Jane'}];
persons.includes(phil); // true

Ändå visar det att vi kan göra include()-verk på objekt, så jag antar att det inte är en total katastrof. 😄

skiva()

Anta att vi har en sträng, och jag ber dig att returnera en del av den som börjar med ”r” och slutar med ”z” (de faktiska tecknen är inte viktiga). Hur skulle du ställa dig till det? Kanske skulle du skapa en ny sträng och använda den för att lagra alla nödvändiga tecken och returnera dem. Eller om du är som de flesta programmerare, skulle du ge mig två arrayindex i gengäld: ett som anger början på delsträngen, det andra markerar slutet.

Båda dessa metoder är bra, men det finns ett koncept som kallas slicing som erbjuder en snygg lösning i sådana situationer. Tack och lov finns det ingen abstru teori att följa; skivning betyder precis vad det låter som – att skapa en mindre sträng/array från den givna, ungefär som vi skapar skivor av frukt. Låt oss se vad jag menar, med hjälp av ett enkelt exempel:

const headline = "And in tonight's special, the guest we've all been waiting for!";
const startIndex = headline.indexOf('guest');
const endIndex = headline.indexOf('waiting');
const newHeadline = headline.slice(startIndex, endIndex);
console.log(newHeadline); // guest we've all been

När vi slicer() tillhandahåller vi två index till JavaScript – det ena där vi vill börja skivningen och det andra där vi vill att det ska sluta. Haken med slice() är att slutindexet inte ingår i slutresultatet, varför vi ser att ordet ”väntar” saknas i den nya rubriken i koden ovan.

Begrepp som skivning är mer framträdande på andra språk, särskilt Python. Om du frågar dessa utvecklare kommer de att säga att de inte kan föreställa sig livet utan denna funktionalitet, och det med rätta när språket ger en väldigt snygg syntax för skivning.

Att skiva är snyggt och extremt bekvämt, och det finns ingen anledning att inte använda det. Det är inte heller syntaxsocker fyllt med prestationsstraff, eftersom det skapar ytliga kopior av den ursprungliga arrayen/strängen. För JavaScript-utvecklare rekommenderar jag starkt att bekanta dig med slice() och lägga till den i din arsenal!

splitsa()

Metoden splice() låter som en kusin till slice(), och på vissa sätt kan vi hävda att det är det. Båda skapar nya arrayer/strängar från de ursprungliga, med en liten men viktig skillnad – splice() tar bort, ändrar eller lägger till element men modifierar den ursprungliga arrayen. Denna ”förstörelse” av den ursprungliga arrayen kan skapa enorma problem om du inte är försiktig eller inte förstår djupa kopior och referenser. Jag undrar vad som hindrade utvecklarna från att använda samma tillvägagångssätt som för slice() och lämna den ursprungliga arrayen orörd, men jag antar att vi kan vara mer förlåtande mot ett språk skapat på bara tio dagar.

Mina klagomål till trots, låt oss ta en titt på hur splice() fungerar. Jag ska visa ett exempel där vi tar bort några element från en array, eftersom detta är den vanligaste användningen du hittar för den här metoden. Jag kommer också att avstå från att ge exempel på tillägg och infogning eftersom dessa lätt kan slås upp och också är enkla.

const items = ['eggs', 'milk', 'cheese', 'bread', 'butter'];
items.splice(2, 1);
console.log(items); // [ 'eggs', 'milk', 'bread', 'butter' ]

Anropet till splice() ovan säger: börja vid index 2 (det vill säga den tredje platsen) i arrayen och ta bort ett objekt. I den givna arrayen är ”ost” det tredje objektet, så det tas bort från arrayen och arrayen av objekt förkortas, som förväntat. Förresten, objekten som tas bort returneras av splice() i formuläret eller en array, så om vi velat kunde vi ha fångat ’ost’ i en variabel.

Enligt min erfarenhet har indexOf() och splice() stor synergi – vi hittar indexet för ett objekt och tar sedan bort det från den givna arrayen. Observera dock att det inte alltid är den mest effektiva metoden, och ofta är det mycket snabbare att använda ett objekt (motsvarande en hashkarta)-nycklar.

flytta()

shift() är en slags bekvämlighetsmetod och används för att ta bort det första elementet i en array. Lägg märke till att samma sak kan göras med splice(), men shift() är lite lättare att komma ihåg och intuitivt när allt du behöver göra är att hugga bort det första elementet.

const items = ['eggs', 'milk', 'cheese', 'bread', 'butter'];
items.shift()
console.log(items); // [ 'milk', 'cheese', 'bread', 'butter' ]

unshift()

Precis som shift() tar bort det första elementet från en array, lägger unshift() till ett nytt element i början av arrayen. Användningen är lika enkel och kompakt:

const items = ['eggs', 'milk'];
items.unshift('bread')
console.log(items); // [ 'bread', 'eggs', 'milk' ]

Som sagt, jag kan inte hjälpa mig själv och varna de som är nya i spelet: till skillnad från de populära push()- och pop()-metoderna är shift() och unshift() extremt ineffektiva (på grund av hur de underliggande algoritmerna fungerar). Så, om du använder stora arrayer (säg 2000+ objekt), kan för många av dessa funktionsanrop stoppa din applikation.

fylla()

Ibland behöver du ändra flera objekt till ett enda värde eller till och med ”återställa” hela arrayen, så att säga. I dessa situationer, räddar fill() dig från loopar och off-by-one-fel. Den kan användas för att ersätta en del eller hela arrayen med det angivna värdet. Låt oss se ett par exempel:

const heights = [1, 2, 4, 5, 6, 7, 1, 1];
heights.fill(0);
console.log(heights); // [0, 0, 0, 0, 0, 0, 0, 0]

const heights2 = [1, 2, 4, 5, 6, 7, 1, 1];
heights2.fill(0, 4);
console.log(heights2); // [1, 2, 4, 5, 0, 0, 0, 0]

Andra funktioner värda att nämna

Även om listan ovan är vad de flesta JavaScript-utvecklare stöter på och använder i sina karriärer, är den inte på något sätt komplett. Det finns så många fler mindre men användbara funktioner (metoder) i JavaScript att det inte kommer att vara möjligt att täcka dem alla i en enda artikel. Som sagt, några som kommer att tänka på är följande:

  • omvänd()
  • sortera()
  • poster()
  • fylla()
  • hitta()
  • platt()

Jag uppmuntrar dig att åtminstone slå upp dessa så att du har en aning om att bekvämligheter som dessa finns.

Slutsats

JavaScript är ett stort språk, trots det lilla antalet grundläggande begrepp att lära sig. De många funktionerna (metoderna) som finns tillgängliga för oss utgör huvuddelen av denna stora storlek. Men eftersom JavaScript är ett sekundärt språk för de flesta utvecklare, dyker vi inte tillräckligt djupt och går miste om många vackra och användbara funktioner som det erbjuder. Egentligen gäller detsamma för funktionella programmeringskoncept, men det är ett ämne för en annan dag! 😅

Närhelst du kan, ägna lite tid åt att utforska kärnspråket (och om möjligt kända verktygsbibliotek som t.ex. Lodash). Till och med några minuter som ägnas åt detta kommer att resultera i enorma produktivitetsvinster och mycket renare och mer kompakt kod.