I den här lektionen kommer vi att bekanta oss med arrayer, lära oss att skapa dem, utföra operationer på deras element och även titta på de grundläggande metoderna och egenskaperna som är tillgängliga när du arbetar med dem.

Vad är en array i JavaScript?

En array är beordrad insamling av värden. Värdena i denna samling kallas element. Varje element i arrayen har sitt eget serienummer (nummer), som kallas index. Index är numrerade från 0.

Följande figur visar en numerisk matris som består av 5 element. Elementen i denna array innehåller följande data: 123 (index 0), 7 (index 1), 50 (index 2), -9 (index 3), 24 (index 4).

Skapa (deklarera) en array

Att skapa arrayer i JavaScript görs vanligtvis med hjälp av array bokstavlig.

En arrayliteral består av hakparenteser som innehåller en lista med element separerade med kommatecken.

Till exempel:

Var tom = ; // tom array var nummer = ; // numerisk matris var arr = ; // array som innehåller olika datatyper

Värdena i en JavaScript-array behöver inte vara av samma typ. De där. En array kan innehålla värden av olika datatyper.

Ett specifikt arrayelement nås av dess index. Denna operation kallas även indexeringsoperationen.

Till exempel:

// skapa en array som består av 3 element var smartphoneColors = ["Svart", "Vit", "Grå"]; // visa i webbläsarkonsolen värdena för smartphoneColors-arrayelementen med index 0 och 2 console.log("Värde på smartphoneColors-arrayelementet med index 0: " + smartphoneColors); // "Värdet på arrayelementet smartphoneColors med index 0: Black" console.log("Värdet på arrayelementet smartphoneColors med index 2: " + smartphoneColors); // "Värdet för smartphoneColors-arrayelementet med index 0: Grey" // ändra värdet på smartphoneColors-arrayelementet med index 1 till "Red" smartphoneColors = "Red"; // ["Svart", "Röd", "Grå"] // ställ in smartphoneColors array-elementet med index 3 till värdet "Blue" smartphoneColors = "Blue"; // ["Svart", "Röd", "Grå", "Blå"]

Du kan använda inte bara statiska värden, utan även uttryck som arrayelementvärden:

Var längdA = 7, breddA = 5; var punkt = ;

Objekt kan användas som arrayelementvärden.

Var-punkter = [(x1:5, y1:3), (x1:7, y1:10), (x1:12; y1:0)]; // array bestående av 3 objekt

Ett annat sätt att skapa en array består av att anropa Array-konstruktorfunktionen.

Ett konstruktorfunktionsanrop utan argument används för att skapa en tom array.

Var empty = new Array(); // tom array

Denna metod för att skapa en array motsvarar en bokstavlig.

Om du anger ett tal som ett argument för konstruktorfunktionen kommer det att skapa en array som kommer att bestå av det angivna antalet element. Dessutom kommer alla dessa element att ha odefinierat värde.

Var arr = new Array(5); // array bestående av 5 element (elementvärdena är odefinierade)

Om du skickar flera värden eller ett icke-numeriskt värde till konstruktorfunktionen inom parentes, kommer den att skapa en array från de argument som skickas till den.

Till skillnad från många andra programmeringsspråk ändrar arrays i JavaScript automatiskt sin storlek, d.v.s. de är till sin natur dynamiska. Sådana arrayer behöver inte ges några dimensioner. En annan utmärkande egenskap hos JavaScript-matriser är att olika element i samma matris kan innehålla olika typer av data.

length egenskap (arraylängd)

Att bestämma längden på arrayen (antal element) görs med hjälp av egenskapen length.

//skapa en array genom att lista värdena för elementen i Array-funktionen var volumeHDDs = new Array("500Gb","1Tb","2Tb"); //tilldela lengthArray-variabeln till längden på volumeHDDs-arrayen var lengthArray = volumeHDDs.length;

Hur man hämtar det första elementet i en array

Att få värdet på det första elementet i en array görs genom att ange numret 0 inom hakparenteser för denna array:

//skapa en array som består av 3 element var volumeHDDs = new Array("500Gb","1Tb","2Tb"); //hämtar värdet av det första elementet i arrayen var firstValue = volymHDD;

Hur man hämtar det sista elementet i en array

Värdet för det sista elementet i en array erhålls genom att ange uttrycket array_name.length-1 inom hakparenteser för denna array:

//skapa en array som består av 3 element var volumeHDDs = new Array("500Gb","1Tb","2Tb"); //hämtar värdet för det sista elementet i arrayen var lastValue = volymHDD;

Itererar över en array

Iteration genom arrayelement görs med en for-loop.

Låt oss till exempel iterera igenom alla element i arrayen och visa deras värden i webbläsarkonsolen (F12):

//skapa ett arraynamn Studenter, bestående av 4 element var nameStudents = new Array("Petya","Vasya","Kolya","Maxim"); //iterate arrayelement från 0 till arraylängd-1 för (var i=0; i<= nameStudents.length-1; i++) { console.log(i+1 + " элемент массива = " + nameStudents[i]); }

Vad är syftet med delete-operatören?

Delete-operatorn används inte för att ta bort ett element från en array, utan för att tilldela värdet undefined till ett givet arrayelement.

Var namePlanets = new Array("Venus","Mercury","Earth","Mars"); ta bort namnPlanets; för (var i=0; i<= namePlanets.length-1; i++) { console.log(i + " элемент массива = " + namePlanets[i]); }

Funktioner för att arbeta med arrayer (Array-objektmetoder)

Array-objektet innehåller följande metoder (funktioner) för att arbeta med arrayer:

• flytta
• avväxling
• skiva
• splitsa
• dela
• omvänd

Push-metod (lägger till ett element i slutet av arrayen)

Pushmetoden är utformad för att lägga till ett element i slutet av arrayen. Värdet på detta element anges som en parameter för denna metod. Som ett resultat returnerar push-metoden antalet element i arrayen, med hänsyn till vad som lagts till.

Var namePlanets = ["Venus", "Mercury", "Earth", "Mars"]; namePlanets.push("Jupiter"); // 5 console.log(namnPlanets); // ["Venus", "Mercury", "Jorden", "Mars", "Jupiter"]

pop-metod (ta bort det sista elementet från en array)

Popmetoden är utformad för att ta bort det sista elementet från en array. Denna metod har inga parametrar. Som ett resultat returnerar den värdet för det sista (borttagna) elementet i arrayen.

Var namePlanets = ["Venus", "Mercury", "Earth", "Mars"]; namePlanets.pop(); // "Mars" console.log(namnPlanets); // ["Venus", "Mercury", "Earth"]

Skiftmetod (ta bort det första elementet från en array)

Skiftmetoden är utformad för att ta bort det första elementet från arrayen, dvs. element med index 0. Alla andra element i arrayen förskjuts till början, dvs. för var och en av dem reduceras indexet med 1. Denna metod returnerar värdet på det borttagna elementet som ett resultat.

Var namePlanets = ["Venus", "Mercury", "Earth", "Mars"]; namePlanets.shift(); // "Venus" console.log(namnPlanets); // ["Mercury", "Earth", "Mars"]

unshift-metod (lägger till ett element i början av arrayen)

Unshift-metoden är utformad för att lägga till ett element i början av arrayen (före andra element). Värdet på detta element anges som en parameter för denna metod. Som ett resultat returnerar den här metoden antalet element i arrayen, med hänsyn till vad som lagts till.

Var namePlanets = ["Mercury", "Earth", "Mars", "Jupiter"]; namePlanets.unshift("Venus"); // 5 console.log(namnPlanets); // ["Venus", "Mercury", "Jorden", "Mars", "Jupiter"]

segmentmetod (kopiera en sektion av en array)

Slicemetoden är utformad för att kopiera en sektion av en array. Den ändrar dock inte den ursprungliga arrayen, utan returnerar som ett resultat en ny array som består av de valda elementen.

Slicemetoden har 2 parametrar:

• 1 parameter (obligatorisk) - är avsedd att indikera indexet för elementet från vilket element kopieras;
• Parameter 2 (valfritt) - är avsedd att indikera indexet för elementet till vilket det är nödvändigt att kopiera (i det här fallet ingår det inte i den nya arrayen). Om du inte anger det, kommer element upp till slutet av den angivna arrayen att kopieras.

var namePlanets = ["Venus", "Mercury", "Earth", "Mars", "Jupiter"]; var newNamePlanets = namePlanets.slice(2, 4); // ["Jorden", "Mars"]

Splitsmetod (ändra innehållet i en array)

Skarvmetoden är utformad för att ändra innehållet i en array. Den kan användas både för att lägga till element i en array och för att ta bort dem.

Syntaxen för skarvningsmetoden är:

Array.splice(startIndex, deleteCount [, element1[, element2[, ...]]]); /* startIndex (obligatoriskt) - startindexet för elementet från vilket man ska börja ändra arrayen. Om du anger ett nummer som är större än längden på arrayen som startIndex, kommer startindexet att sättas till slutet av arrayen. Om du anger ett negativt tal som startIndex, kommer startelementet att räknas från slutet. deleteCount (obligatoriskt) - ett nummer som anger hur många element som måste tas bort från arrayen. Om element inte behöver tas bort från arrayen så måste deleteCount sättas till 0. Efter detta måste du ange minst ett nytt element som ska läggas till i arrayen. Om du anger ett nummer som deleteCount som kommer att överstiga antalet återstående element i arrayen, med början från startIndex, kommer de i det här fallet fortfarande att tas bort (dvs. alla element till slutet av arrayen, med början från startindexet) element1, element2, ... (valfritt) - element som måste läggas till i arrayen. */

Exempel på användning av skarvmetoden.

Använder skarvmetoden för att ta bort vissa element från en array.

Var namePlanets = ["Venus", "Mercury", "Earth", "Mars"]; namePlanets.splice(2, 2); //["Jorden", "Mars"] console.log(namnPlanets); // ["Venus", "Mercury"]

Använda skarvmetoden för att ta bort ett element från en array och lägga till nya till det.

Var namePlanets = ["Venus", "Mercury", "Earth", "Mars"]; namePlanets.splice(1, 1, "Uranus", "Neptunus", "Saturnus"); // ["Mercury"] console.log(namnPlanets); // ["Venus", "Uranus", "Neptunus", "Saturnus", "Jorden", "Mars"]

Använder enbart splitsmetoden för att lägga till nya element till en array.

Var namePlanets = ["Jupiter", "Saturnus", "Uranus"]; namePlanets.splice(0, 0, "Venus", "Mercury", "Earth", "Mars"); // console.log(namnPlanets); // ["Venus", "Mercury", "Jorden", "Mars", "Jupiter", "Saturnus", "Uranus"]

join-metod (konvertera en array till en sträng)

Sammanfogningsmetoden är utformad för att sammanfoga alla element i en array till en sträng.

Anslut metodsyntax:

Array.join(); /* separator (valfritt) - en separator som används som en kopplingssträng mellan varje matriselement. Om denna parameter inte är specificerad kommer "," att användas som den anslutande strängen. Om du anger en tom sträng som en parameter, kommer arrayelementen i den returnerade strängen inte att separeras av någonting */

Var bär = ["Druvor", "Druvor", "Vinbär", "Nöspon"]; var berriesStr1 = berries.join(); // "Druvor, vindruvor, vinbär, nypon" var berriesStr2 = berries.join(""); // "GrapesGrapesCurrantRosehip" var berriesStr3 = berries.join(", "); // "Druvor, vindruvor, vinbär, nypon" var berriesStr4 = berries.join(" + "); // "Druvor + Vindruvor + Vinbär + Nypon"

Om du använder en icke-sträng som separator, kommer den att konverteras till en sträng.

Var bär = ["Druvor", "Druvor", "Vinbär", "Nöspon"]; var berriesStr1 = berries.join(false); // "GrapesfalseGrapesfalseCurrantfalseRosehip" var berriesStr2 = berries.join(4/2); // "Grapes2Grapes2Currant2Rose Hip" Arrayelement som har null eller odefinierat som ett värde kommer att kastas till den tomma strängen. var arr = ; var arrStr = arr.join(", "); // "0, 5, -4"

Konvertera en sträng till en array - split

Splitmetoden är utformad för att konvertera en sträng till en array. Den här metoden har en parameter, som du kan ange en sträng, baserat på vilken denna sträng kommer att delas upp i en array av strängar.

Var strElementComputers = "Systemenhet, bildskärm, tangentbord, mus, högtalare, skrivare"; var elementComputers = strElementComputers.split(", "); console.log("Antal element i arrayen: " + elementComputers.length); för (var i=0; i<= elementComputers.length-1; i++) { console.log(i + " элемент массива = " + elementComputers[i]); }

Omordning av arrayelement i omvänd ordning - omvänd

Den omvända metoden är utformad för att ordna om arrayelement i omvänd ordning.

Var namePlanets = new Array("Venus","Mercury","Earth","Mars"); namePlanets.reverse(); console.log("Antal element i arrayen: " + namePlanets.length); för (var i=0; i<= namePlanets.length-1; i++) { console.log(i + " элемент массива = " + namePlanets[i]); }

Sortera arrayelement - sortera

Sorteringsmetoden används för att sortera arrayelement. Som standard sorterar den här metoden arrayen som strängar.

Var namePlanets = new Array("Venus","Mercury","Earth","Mars"); namePlanets.sort(); console.log("Antal element i arrayen: " + namePlanets.length); för (var i=0; i<= namePlanets.length-1; i++) { console.log(i + " элемент массива = " + namePlanets[i]); }

21/06/2017 kl 12:17

För att beräkna storleken på en array av objekt i JavaScript, använd egenskapen length för arrayen.

Var arr = ["första", "andra"]; console.log(arr.längd); // 2

Arrayer i javascript kan sakna index. Till exempel

Var arr = ; arr = "första"; arr = "andra";

Egenskapen length returnerar det maximala indexet för arrayen + 1, dvs. i det angivna exemplet är längd = 5.

Beräkna antalet element i en array i javascript

Array.prototype.count = function())( var resultat = 0; for(var i = 0; i< this.length; i++) if (this[i] != undefined) result++; return result; }

Användningsexempel

Var arr = ; arr = "första"; arr = "andra"; console.log(arr.count()); //2

Du kan också tilldela ett värde till egenskapen length. Detta gör att du kan minska längden på en befintlig array.

Var arr = ["första", "andra", "tredje"]; arr.längd = 2; console.log(arr); // ["första sekunden"]

Beräknar storleken på en array i byte i javascript

Arrayer är vanliga objekt, så att beräkna storleken på en array i byte är inte annorlunda än att beräkna storleken på något annat objekt. Tyvärr tillhandahåller javascript inget API för att beräkna storleken, så du måste beräkna det själv. Detta görs på följande sätt: vi går igenom alla egenskaper för objektet; om egenskapen är av en primitiv typ lägger vi till storleken på en instans av denna typ till det totala resultatet; om egenskapen innehåller ett objekt beräknar vi rekursivt dess storlek.

Funktion sizeOf(obj) ( var bytes = 0; if(obj !== null && obj !== odefinierad) ( switch(typeof obj) ( case "number": bytes += 8; break; case "string": bytes += obj.length * 2; break; case "boolean": bytes += 4; break; case "object": for(var nyckel i obj) ( bytes += sizeOf(obj); ) break; ) ) returnera bytes ; );

Metoden är inte exakt och har många problem - det finns till exempel möjlighet att gå in i en oändlig loop.

Senaste uppdatering: 2018-03-26

Array-objektet representerar en array och tillhandahåller ett antal egenskaper och metoder med vilka vi kan manipulera arrayen.

Initiera en Array

Du kan skapa en tom array med hakparenteser eller Array-konstruktorn:

Var användare = new Array(); var människor = ; console.log(användare); // Array console.log(people); //Array

Du kan omedelbart initiera en array med ett visst antal element:

Var användare = new Array("Tom", "Bill", "Alice"); var people = ["Sam", "John", "Kate"]; console.log(användare); // ["Tom", "Bill", "Alice"] console.log(people); // ["Sam", "John", "Kate"]

Du kan definiera en array och lägga till nya element till den allt eftersom:

Var användare = new Array(); användare = "Tom"; användare = "Kate"; console.log(användare); // "Tom" console.log(users); //odefinierad

Det spelar ingen roll att arrayen som standard skapas med noll längd. Med hjälp av index kan vi ersätta ett eller annat element i en array vid ett specifikt index.

längd

För att ta reda på längden på en array, använd egenskapen length:

Var fruit = new Array(); frukt = "äpplen"; frukt = "päron"; frukt = "plommon"; document.write("I arrayen frukt " + fruit.length + " element:
"); för(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

Faktum är att längden på arrayen är indexet för det sista elementet plus ett. Till exempel:

Var användare = new Array(); // det finns 0 element i arrayanvändarna = "Tom"; användare = "Kate"; användare = "Sam"; för(var i=0; i

Webbläsarutgång:

Tom Kate undefined odefinierad Sam

Trots att vi inte har lagt till element för index 2 och 3, kommer längden på arrayen i det här fallet att vara siffran 5. Det är bara att element med index 2 och 3 kommer att ha värdet undefined .

Kopiera en array. skiva()

Att kopiera en array kan vara ytlig eller ytlig (grund kopia) och djup (djup kopia).

För ytlig kopiering räcker det att tilldela en variabel värdet på en annan variabel som lagrar en array:

Var användare = ["Tom", "Sam", "Bill"]; console.log(användare); // ["Tom", "Sam", "Bill"] var people = users; // grunt kopierande folk = "Mike"; // ändra det andra elementet console.log(users); // ["Tom", "Mike", "Bill"]

I det här fallet kommer personvariabeln, efter kopiering, att peka på samma array som användarvariabeln. Därför, när du ändrar elementen i människor, kommer elementen i användarna också att förändras, eftersom det i själva verket är samma array.

Detta beteende är inte alltid önskvärt. Till exempel vill vi att variablerna ska peka på separata arrayer efter kopiering. Och i det här fallet kan du använda djupkopiering med metoden slice():

Var användare = ["Tom", "Sam", "Bill"]; console.log(användare); // ["Tom", "Sam", "Bill"] var people = users.slice(); // deep copy people = "Mike"; // ändra det andra elementet console.log(users); // ["Tom", "Sam", "Bill"] console.log(people); // ["Tom", "Mike", "Bill"]

I det här fallet, efter kopiering, kommer variablerna att peka på olika arrayer, och vi kan ändra dem separat från varandra.

Metoden slice() låter dig också kopiera en del av en array:

Var användare = ["Tom", "Sam", "Bill", "Alice", "Kate"]; var people = users.slice(1, 4); console.log(människor); // ["Sam", "Bill", "Alice"]

Metoden slice() passerar start- och slutindexen, som används för att hämta värden från arrayen. Det vill säga, i detta fall går valet i den nya arrayen från index 1 till index 4, exklusive. Och eftersom arrayindexering börjar från noll kommer den nya arrayen att innehålla de andra, tredje och fjärde elementen.

skjuta på()

Metoden push() lägger till ett element i slutet av arrayen:

Var frukt = ; fruit.push("äpplen"); fruit.push("päron"); fruit.push("plommon"); fruit.push("körsbär","aprikos
"); document.write(frukt); // äpplen, päron, plommon, körsbär, aprikoser

pop()

Metoden pop() tar bort det sista elementet från arrayen:

Var fruit = ["äpplen", "päron", "plommon"]; var lastFruit = fruit.pop(); // extrahera det sista elementet från arrayen document.write(lastFruit + "
"); document.write("I arrayen frukt " + fruit.length + " element:
"); för(var i=0; i ");

Webbläsarutgång:

Plommon Fruktarrayen har 2 element: äpplen päron

flytta()

Metoden shift() hämtar och tar bort det första elementet från arrayen:

Var fruit = ["äpplen", "päron", "plommon"]; var firstFruit = fruit.shift(); document.write(firstFruit + "
"); document.write("I arrayen frukt " + fruit.length + " element:
"); för(var i=0; i ");

Webbläsarutgång:

Äpplen Fruktarrayen har 2 element: päron plommon

unshift()

Metoden unshift() lägger till ett nytt element i början av arrayen:

Var fruit = ["äpplen", "päron", "plommon"]; fruit.unshift("aprikoser"); document.write(frukt);

Webbläsarutgång:

Aprikoser, äpplen, päron, plommon

Ta bort ett element efter index. splitsa()

Metoden splice() tar bort element vid ett specifikt index. Till exempel, ta bort element från det tredje indexet:

Var användare = ["Tom", "Sam", "Bill", "Alice", "Kate"]; var deleted = users.splice(3); console.log(raderad); // [ "Alice", "Kate" ] console.log(users); // [ "Tom", "Sam", "Bill" ]

Slicemetoden returnerar de borttagna elementen.

I det här fallet sker borttagningen från början av arrayen. Om du passerar ett negativt index kommer raderingen att utföras från slutet av arrayen. Låt oss till exempel ta bort det sista elementet:

Var användare = ["Tom", "Sam", "Bill", "Alice", "Kate"]; var deleted = users.splice(-1); console.log(raderad); // [ "Kate" ] console.log(users); // [ "Tom", "Sam", "Bill", "Alice" ]

En ytterligare version av metoden låter dig ange slutindexet för radering. Låt oss till exempel ta bort det första till det tredje indexet:

Var användare = ["Tom", "Sam", "Bill", "Alice", "Kate"]; var raderad = användare.splice(1,3); console.log(raderad); // [ "Sam", "Bill", "Alice" ] console.log(users); // [ "Tom", "Kate" ]

En annan version av skarvningsmetoden låter dig infoga nya element istället för borttagna element:

Var användare = ["Tom", "Sam", "Bill", "Alice", "Kate"]; var deleted = users.splice(1,3, "Ann", "Bob"); console.log(raderad); // [ "Sam", "Bill", "Alice" ] console.log(users); // [ "Tom", "Ann", "Bob", "Kate" ]

I det här fallet tar vi bort tre element från 1:a till 3:e indexet och infogar två element istället.

concat()

Concat()-metoden används för att kombinera arrayer:

Var fruit = ["äpplen", "päron", "plommon"]; var grönsaker = ["tomater", "gurkor", "potatis"]; var products = fruit.concat(grönsaker); för(var i=0; i< products.length; i++) document.write(products[i] + "
");

I det här fallet är det inte nödvändigt att bara kombinera arrayer av samma typ. Olika typer är möjliga:

Var fruit = ["äpplen", "päron", "plommon"]; var priser = ; var products = fruit.concat(prices);

Ansluta sig()

Metoden join() sammanfogar alla element i en array till en sträng:

Var fruit = ["äpplen", "päron", "plommon", "aprikoser", "persikor"]; var fruitString = fruit.join(", "); document.write(fruitString);

Metoden join() skickas separatorn mellan arrayelement. I det här fallet kommer ett kommatecken och ett mellanslag (", ") att användas som avgränsare.

sortera()

Metoden sort() sorterar arrayen i stigande ordning:

Var fruit = ["äpplen", "päron", "plommon", "aprikoser", "persikor"]; fruit.sort(); för(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

Webbläsarutgång:

Aprikoser päron persikor plommon äpplen

omvänd()

Metoden reverse() vänder arrayen bakåt:

Var fruit = ["äpplen", "päron", "plommon", "aprikoser", "persikor"]; fruit.reverse(); för(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

Webbläsarutgång:

Persikor aprikoser plommon päron äpplen

I kombination med sort()-metoden kan du sortera arrayen i fallande ordning:

Var fruit = ["äpplen", "päron", "plommon", "aprikoser", "persikor"]; fruit.sort().reverse(); för(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

Webbläsarutgång:

Äpplen plommon persikor päron aprikoser

Hitta ett elements index

Metoderna indexOf() och lastIndexOf() returnerar indexet för den första och sista inkluderingen av ett element i arrayen. Till exempel:

Var fruit = ["äpplen", "päron", "plommon", "äpplen", "päron"]; var firstIndex = fruit.indexOf("äpplen"); var lastIndex = fruit.lastIndexOf("äpplen"); var otherIndex = fruit.indexOf("körsbär"); document.write(firstIndex); // 0 document.write(lastIndex); // 3 document.write(otherIndex); // -1

firstIndex har värdet 0 eftersom den första inkluderingen av "äpplen"-raden i arrayen är vid index 0, och den sista är vid index 3.

Om elementet inte finns i arrayen returnerar i det här fallet metoderna indexOf() och lastIndexOf() värdet -1.

varje()

Metoden every() kontrollerar om alla element matchar ett visst villkor:

Var-tal = [1, -12, 8, -4, 25, 42]; funktionsvillkor(värde, index, matris) ( var resultat = falskt; if (värde > 0) ( resultat = sant; ) returnerar resultat; ); var passerat = numbers.every(condition); document.write(godkänd); // falskt

Metoden every() skickas en funktion som representerar villkoret som en parameter. Denna funktion tar tre parametrar:

Funktionsvillkor (värde, index, matris) ( )

Värdeparametern representerar det aktuella arrayelementet som itereras, indexparametern representerar indexet för det elementet och arrayparametern skickar en referens till arrayen.

I den här funktionen kan vi kontrollera det godkända elementvärdet för överensstämmelse med något villkor. Till exempel, i det här exemplet kontrollerar vi varje element i arrayen för att se om det är större än noll. Om det är större returnerar vi värdet true , det vill säga elementet uppfyller villkoret. Om mindre, returnera false - elementet uppfyller inte villkoret.

Som ett resultat, när metoden numbers.every(condition) anropas, itererar den genom alla element i numerisk matris och skickar dem en efter en till villkorsfunktionen. Om denna funktion returnerar true för alla element, returnerar every()-metoden true. Om minst ett element inte matchar villkoret, returnerar every()-metoden false .

några()

Metoden some() liknar metoden every(), bara den kontrollerar om minst ett element matchar ett villkor. Och i det här fallet returnerar metoden some() true . Om det inte finns några element som matchar villkoret i arrayen, returneras false:

Var-tal = [1, -12, 8, -4, 25, 42]; funktionsvillkor(värde, index, matris) ( var resultat = falskt; if (värde === 8) ( resultat = sant; ) returnerar resultat; ); var passerat = numbers.some(condition); // Sann

filtrera()

Filter()-metoden, som some() och every() , accepterar en villkorsfunktion. Men samtidigt returnerar den en rad av de element som uppfyller detta villkor:

Var-tal = [1, -12, 8, -4, 25, 42]; funktionsvillkor(värde, index, matris) ( var resultat = falskt; if (värde > 0) ( resultat = sant; ) returnerar resultat; ); var filteredNumbers = numbers.filter(condition); för(var i=0; i< filteredNumbers.length; i++) document.write(filteredNumbers[i] + "
");

Webbläsarutgång:

1 8 25 42

forEach() och map()

Metoderna forEach() och map() itererar över element och utför vissa operationer på dem. Till exempel, för att beräkna kvadraterna av tal i en matris, kan du använda följande kod:

Var-tal = [1, 2, 3, 4, 5, 6]; for(var i = 0; i "); }

Men med metoden forEach() kan du förenkla denna konstruktion:

Var-tal = [1, 2, 3, 4, 5, 6]; funktion kvadrat(värde, index, matris) ( var resultat = värde * värde; document.write("Kvadraten på talet " + värde + " är " + resultat + "
"); ); numbers.forEach(square);

Metoden forEach() tar som en parameter samma funktion, till vilken, när det itereras över element, det aktuella elementet som itereras skickas och operationer utförs på det.

Map()-metoden liknar metoden forEach; den tar också som parameter en funktion som utför operationer på elementen i arrayen, men map()-metoden returnerar en ny array med resultatet av operationer på arrayelementen.

Låt oss till exempel använda kartmetoden för att beräkna kvadraterna av tal i en matris:

Var-tal = [1, 2, 3, 4, 5, 6]; funktion kvadrat(värde, index, matris) (returresultat = värde * värde; ); var squareArray = numbers.map(square); document.write(squareArray);

Funktionen som skickas till map()-metoden tar emot det aktuella elementet som itereras, utför operationer på det och returnerar något värde. Detta värde går sedan in i den resulterande squareArray

I den här artikeln kommer vi att titta på standard JavaScript-matriser med numeriska index. Arrayer deklareras med hakparenteser:

var fruits = ["Äpple", "Apelsin", "Åsna"]

För att extrahera ett element, placera dess index inom hakparenteser. Första index 0:

var fruits = ["Äpple", "Apelsin", "Åsna"] alert(frukter) alert(frukter) alert(frukter)

Vi kan också få längden på en JavaScript-array:

var fruits = ["Äpple", "Apelsin", "Donkey"] alert(fruits.length)

hoppsan! Vi skapade en array med två frukter och en åsna. Nu måste vi ta bort åsnan.

pop och push-metoder

Popmetoden i JavaScript tar bort ett element från en array och returnerar det.

Följande exempel visar hur "Donkey" hämtas från en array:

var fruits = ["Apple", "Orange", "Donkey"] alert("Jag tar bort "+fruits.pop()) // Nu har vi bara ["Apple","Orange"] alert("Nu storleken på arrayen: "+fruits.length) // åsnan borttagen

Observera att pop modifierar själva arrayen.

Pops motsvarighet är push-metoden, som lägger till ett element till en array. Till exempel glömde vi att lägga till en persika:

var fruits = ["Äpple", "Orange"] fruits.push("Peach"); // nu har vi ["Apple", "Orange", "Peach"] alert("Sista element:"+frukter)

1. Skapa en rad stilar med element " Jazz”, “Blues”;
2. Lägg till värdet " Rock'n'Roll«;
3. Ersätt det andra värdet från slutet med värdet " Klassisk". Du bör sluta med en array: " Jazz”, ”Klassisk”, ”Rock'n'Roll" Koden bör fungera för alla arraylängder;
4. Hämta det sista värdet från arrayen och visa det via varning.

Lösning

// 1 var styles = ["Jazz", "Bluez"] // 2 styles.push("Rock"n"Roll") // eller: styles = "Rock"n"Roll" // 3 styles = "Klassisk " // 4 alert(styles.pop())

Skift/unshift metoder

Shift/unshift-metoderna fungerar i slutet av arrayen, men du kan också använda shift för att flytta element uppåt ( det första värdet på arrayen tas bort genom att flytta elementen). Unshift-metoden tillåter JavaScript att lägga till ett element i en array från slutet:

var fruits = ["Apple", "Orange"] var apple = fruits.shift() // nu har vi bara ["Orange"] fruits.unshift("Citron") // nu har vi ["Citron", " Orange"] alert(fruits.length) // 2

Både växling och avväxling kan arbeta på flera element samtidigt:

var fruits = ["Apple"] fruits.push("Orange","Peach") fruits.unshift("Pineapple","Citron") // nu ser arrayen ut så här: ["Ananas", "Citron", "Äpple", "Apelsin", "Peach"]

Självadministrerad uppgift

Skriv koden för att visa ett slumpmässigt värde från arr-arrayen via varning:

var arr = ["Plum","Orange","Donkey","Morot","JavaScript"]

Obs: Koden för att få ett slumptal från det lägsta till det högsta värdet (inklusive) är följande:

var rand = min + Math.floor(Math.random()*(max+1-min))

Lösning

Vi behöver extrahera ett slumptal från 0 till arr.length-1 (inklusive):

var arr = ["Plum","Orange","Donkey","Morot","JavaScript"] var rand = Math.floor(Math.random()*arr.length) alert(arr)

Itererar över en array

I JavaScript görs iteration genom en array med en for-loop:

var fruits = ["Ananas", "Citron", "Äpple", "Apelsin", "Peach"] for(var i=0; i

Självadministrerad uppgift

Skapa en funktion find(arr,value) som hittar ett värde i en given array och returnerar dess index eller -1 om värdet inte hittas.

Till exempel:

arr = [ "test", 2, 1.5, false ] find(arr, "test") // 0 find(arr, 2) // 1 find(arr, 1.5) // 2 find(arr, 0) // -1

Lösning

En möjlig lösning kan se ut så här:

funktion hitta(matris, värde) (för(var i=0; i

Men detta är felaktigt eftersom == inte definierar skillnaden mellan 0 och falskt.

Det är mer korrekt att använda === när man arbetar med arrays i JavaScript. Dessutom innehåller den senaste ES5-standarden funktionen Array#indexOf. Med den kan vi definiera en funktion så här:

funktion find(array, value) (if (array.indexOf) returnerar array.indexOf(value) for(var i=0; i

Ännu smartare skulle vara att definiera hitta med ett villkor för att kontrollera om metoden indexOf existerar.

Självadministrerad uppgift

Skapa en funktion filterNumeric(arr) som tar en array och returnerar en ny array som bara innehåller de numeriska värdena från arr .

Ett exempel på hur detta ska fungera:

arr = ["a", 1, "b", 2]; arr = filterNumeric(arr); // nu arr =

Lösning

Lösningen är att iterera genom arrayen och lägga till värdena till en ny array om de är numeriska.

gå med och dela

Ibland behöver du ett snabbt sätt att konvertera en JavaScript-array till en sträng. Detta är vad kopplingsmetoden är till för.

Den sammanfogar arrayen till en sträng med den givna avgränsaren:

var fruits = ["Citron","Äpple","Apelsin","Peach"]; var str = fruits.join(", "); alert(str);

Den omvända konverteringen görs enkelt med splitmetoden:

var fruits = "Äpple, apelsin, persika"; var arr = fruits.split(","); // arr innehåller nu ["Apple", "Orange", "Peach"] alert(arr);

Självadministrerad uppgift

Objektet innehåller en className-egenskap, som innehåller klassnamnen, separerade med mellanslag:

Skriv en funktion addClass(obj, cls) som lägger till klassen cls , men bara om den inte finns:

ddClass(obj, "new") // obj.className="öppna meny ny" addClass(obj, "open") // inga ändringar (klass finns redan) addClass(obj, "mig") // obj.className= "öppna menyn ny mig" alert(obj.className) //

Lösning

Du måste dela upp className och loopen i delar. Om klassen inte hittas läggs den till.

Slingan har optimerats något för att öka prestandan:

function addClass(elem, cls) ( for(var c = elem.className.split(" "), i=c.length-1; i>=0; i--) ( if (c[i] == cls ) return ) elem.className += " "+cls ) var obj = ( className: "öppen meny" ) addClass(obj, "new") addClass(obj, "open") alert(obj.className) // öppna menyn ny

I exemplet ovan definieras variabeln c i början av loopen och dess sista index är satt till i .

Själva slingan bearbetas i motsatt riktning och slutar med villkoret i>=0. Eftersom i>=0 är snabbare att kontrollera än i . Vad i JavaScript påskyndar sökning i en array.

Använda längd för att trimma en array

Med hjälp av egenskapen length kan du trunkera en array så här:

Du anger längden och webbläsaren trunkerar arrayen.

Array är ett objekt, så vad betyder detta?

Faktum är att i JavaScript är en Array ett objekt, komplett med automatisk längdinställning och speciella metoder.

Detta skiljer sig från konceptet på andra språk, där arrayer representerar ett sammanhängande minnessegment. Detta skiljer sig också från en kö eller stack baserad på länkade listor.

Icke-numeriska array-nycklar

Nycklar är siffror, men de kan ha vilket namn som helst:

arr = arr = 5 arr.prop = 10 // gör inte detta

I JavaScript är arrayer hashtabeller, som har prestandafördelar men också vissa nackdelar.

Till exempel fungerar push/pop bara på de yttersta elementen i en array, så de är otroligt snabba.

push fungerar bara med slutet:

var arr = ["Min", "array"] arr.push("något") alert(arr) // string "array"

Shift/unshift-metoderna är långsamma eftersom de behöver numrera om hela arrayen. Skarvmetoden kan också få numreringen att ändras:

Så shift/unshift är långsammare än push/pop. Ju större array, desto längre tid tar det JavaScript att sortera arrayen.

Självadministrerad uppgift

Vad blir resultatet? Varför?

arr = ["a", "b"] arr.push(function() ( alert(this) )) arr() // ?

Lösning

Eftersom arrayer är objekt, arr ..är faktiskt ett metodanrop på ett objekt såsom obj metod:

arr() // samma som arr() // syntaktiskt felaktig, men konceptuellt samma: arr.2() // omskriven i samma stil som obj.method() this = arr i detta fall skickas till funktionen, så att innehållet i arr skrivs ut. arr = ["a", "b"] arr.push(function() ( alert(this) )) arr() // "a","b",function

Glesa arrayer, längdbeskrivning

Length-egenskapen låter dig inte få storleken på en array i JavaScript, utan det sista indexet + 1. Detta är viktigt när vi talar om glesa arrayer, med "luckor" i indexen.

I följande exempel kommer vi att lägga till två element till de tomma frukterna, men längdvärdet förblir 100:

var fruits = // tomma array fruits = "Peach" fruits = "Apple" alert(fruits.length) // 100 (men det finns bara 2 element i arrayen)

Om du försöker mata ut en gles array kommer webbläsaren att returnera de saknade indexvärdena som tomma element:

var fruits = // tomma array fruits = "Peach" fruits = "Apple" alert(frukter) //,Peach,Apple (eller något liknande)

Men en array är ett objekt med två nycklar. Saknade värden tar inte plats.

Sparse arrays beter sig konstigt när array-metoder tillämpas på dem. De har ingen aning om att index saknas:

var fruits = fruits = "Peach" fruits = "Apple" alert(fruits.pop()) // pop "Apple" (till index 9) alert(fruits.pop()) // pop ett ospecificerat element (till index 8) )

Försök att undvika glesa arrayer. Hur som helst kommer deras metoder inte att fungera normalt. Använd Object istället.

Ta bort från en array

Som vi vet är arrayer objekt, så vi kan använda delete för att ta bort ett värde:

var arr = ["Gå", "till", "hem"] radera arr // nu arr = ["Gå", odefinierad, "hem"] alert(arr) // inte definierad

Du kan se att värdet tas bort, men inte på det sätt vi skulle vilja, eftersom arrayen innehåller ett ospecificerat element.

Operatorn delete tar bort ett nyckel-värdepar och det är allt. Eftersom arrayen endast är en hash, blir det borttagna elementets position odefinierad.

Oftast behöver vi ta bort ett element utan att lämna "hål" mellan indexen. Det finns en annan metod som hjälper oss med detta.

skarvningsmetod

Splitsmetoden kan ta bort element och ersätta dem i flerdimensionella JavaScript-matriser. Dess syntax är:

arr.splice(index, deleteCount[, elem1, ..., elemN])

Tar bort elementet deleteCount som börjar vid index och infogar sedan elem1, ..., elemN i dess ställe.

Låt oss titta på några exempel:

var arr = ["Gå", "till", "hem"] arr.splice(1, 1) // ta bort 1 element som börjar vid index 1 alert(arr.join(",")) // ["Go " , "home"] (1 element har tagits bort)

Så du kan använda skarv för att ta bort ett element från en array. Matriselementnumren flyttas för att fylla utrymmet:

var arr = ["Gå", "till", "hem"] arr.splice(0, 1) // ta bort 1 element, från index 0 alert(arr) // "to" blev det första elementet

Följande exempel visar hur man byter ut element:

Splitsmetoden returnerar en array av borttagna element:

var arr = ["Gå", "till", "hem", "nu"]; // remove the first 2 elements var removed = arr.splice(0, 2) alert(removed) // "Go", "to"<-- массив удаленных элементов splice может вставлять элементы, задайте 0 для deleteCount. var arr = ["Go", "to", "home"]; // со второй позиции // удаляем 0 // и вставляем "my", "sweet" arr.splice(2, 0, "my", "sweet") alert(arr) // "Go", "to", "my", "sweet", "home"

Denna metod kan också använda ett negativt index, som räknas från slutet av arrayen:

var arr = // för element -1 (näst sista) // ta bort 0 element, // och infoga 3 och 4 arr.splice(-1, 0, 3, 4) alert(arr) // 1,2,3, 4.5

Självadministrerad uppgift

Objektet innehåller en className-egenskap, som innehåller klassnamnen, separerade med mellanslag:

var obj = (klassnamn: "öppen meny")

Skriv en funktion removeClass(obj, cls) som tar bort klassen cls om den ges:

removeClass(obj, "öppen") // obj.className="menu" removeClass(obj, "blabla") // inga ändringar (det finns ingen klass att ta bort)

Lösning

Du måste dela upp className i delar och gå igenom dessa delar. Om en matchning hittas tas den bort från JavaScript-uppsättningen av objekt och läggs sedan tillbaka till slutet.

Låt oss optimera detta lite:

function removeClass(elem, cls) ( for(var c = elem.className.split(" "), i=c.length-1; i>=0; i--) ( if (c[i] == cls ) c.splice(i,1) ) elem.className = c.join(" ") ) var obj = ( className: "öppen meny" ) removeClass(obj, "open") removeClass(obj, "blabla") alert (obj.className) // meny

I exemplet ovan sätts variabeln c i början av slingan och i sätts till dess sista index.

Själva slingan löper i motsatt riktning och slutar med villkoret i>=0. Detta görs eftersom i>=0 kontrolleras snabbare än i . Vilket påskyndar sökningen efter fastigheter i c .

skivningsmetod

Du kan extrahera en del av en array med metoden slice(begin[, end]): var arr = ["Varför", "lär dig", "JavaScript"]; var arr2 = arr.slice(0,2) // tar 2 element, börjar på 0 alert(arr2.join(", ")) // "Varför, lär dig"

Observera att den här metoden inte ändrar antalet element i arrayen i JavaScript, utan kopierar en del av den.

Du kan utelämna det andra argumentet för att få alla element från ett specifikt index:

var arr = ["Varför", "lär dig", "JavaScript"]; var arr2 = arr.slice(1) // tar alla element från 1 alert(arr2.join(", ")) // "learn, JavaScript"

Metoden stöder negativa index, precis som String#slice .

omvänd metod

En annan användbar metod är omvänd. Låt oss säga att jag vill få den sista delen av en domän som " com" från " my.site.com" Så här gör du:

var domain = "my.site.com" var last = domain.split(".").reverse() alert(last)

Observera att JavaScript-matriser stöder en komplex syntax (reverse()) för att anropa en metod och sedan hämta ett element från den resulterande matrisen.

Du kan skapa längre samtal som reverse() 0] arr.sort() alert(arr) // 1, 15, 2

Kör ovanstående kod. Du får beställningen 1, 15, 2. Detta beror på att metoden konverterar allt till en sträng och använder lexikografisk ordning som standard.