3 saker du inte vet om JavaScript-arrays
arrayer är en allmänt använd funktion av programmeringsspråk; dom är speciella variabler som kan användas för att lagra flera värden samtidigt. Men när det gäller JavaScript, så enkelt som det är att lära sig, finns det alltid mer att utforska.
I det här inlägget tar vi en titt på tre mindre kända men viktiga funktioner i JavaScript-uppsättningar som du kanske inte har känt förut.
1. Lägg till anpassade egenskaper i Arrays
Om du skulle skura Internet efter en grundlig definition av JavaScript-arrays, kommer du att upptäcka att nästan alla källor utan misslyckande kommer att lista array som vad det verkligen är, ett objekt.
Faktum är att nästan allt vi hanterar i JavaScript kommer att göra visa sig vara ett föremål. Det finns två typer av datatyper i JavaScript, primitiver och objekt, men Primitives är alltid inslagna i föremål.
Array, Function, Date etc. är fördefinierade JavaScript-objekt som har inbyggda metoder, egenskaper och egen standardiserad syntax.
JavaScript-uppsättningar kan ha tre olika typer av egenskaper:
- Index av en array är också egenskaper
- Inbyggda egenskaper
- Anpassade egenskaper du kan lägga till själv
De två första är mer kända, du kan använda dem varje dag, men låt oss se dem snabbt innan du hoppar in hur du kan lägga till din egen egendom till en rad.
Index som Egenskaper
JavaScript-arrays använder kvadratisk konsolsyntax, som var ary = ["orange", "äpple", "litchi"];.
Index av arrayelement är i grunden egenskaper där det fastighetsnamn är alltid icke-negativa heltal.
De indexelementparet av en array liknar nyckelvärdespar av ett objekt.
Indexer är en unik egenskap hos Array-objektet, och till skillnad från de andra inbyggda egenskaperna kan de vara ställa in med parentes syntax ensam, som ary [3] = "persika";.
Inbyggda egenskaper
Arrays har också inbyggda egenskaper, som Array.length. De längd egenskapen har ett heltal som anger längden på en array.
Generellt kan inbyggda egenskaper ofta hittas i fördefinierade JavaScript-objekt som arrayer. Tillsammans med de inbyggda metoderna hjälper de Anpassa generiska objekt så att objekten är lämpliga för olika behov.
Inbyggda egenskaper kan nås med antingen object.key eller den invända [ "nyckel"] syntax. Så du kan också skriva ary [ "längd"] för att komma åt längden på en array.
Skapa anpassade egenskaper för Array Object
Nu pratar vi om lägga till egna egenskaper till arrays. Arrays är fördefinierade objekt som lagrar olika typer av värden vid olika index.
Det finns vanligtvis inte mycket behov av att lägga till anpassade egenskaper i en array; Detta är en av anledningarna till att nybörjare vanligtvis inte lärs om denna funktion. Om du vill behandla en matris som ett normalt objekt genom att lägga till nyckelvärdespar till det, kanske du också använd ett normalt objekt för ditt syfte. Men det betyder inte att det inte finns det speciella fall där du kan utnyttja det faktum att en matris är ett objekt, genom att lägga till en eller flera anpassade egenskaper till den.
Till exempel kan du lägga till en anpassad egenskap till en array som identifierar "sorten" eller "klassen" av dess element, som om du kan se den i exemplet nedan.
var ary = ["orange", "äpple", "litchi"]; ary.itemClass = "frukter"; console.log (ary + "är" + ary.itemClass); // "apelsin, äpple, lychee är frukter"
Observera att den anpassade egenskapen du lägger till i en array är uppräkningsbar, vilket betyder att det kommer att hämtas av loopar som för ... in påstående.
2. Loop through Array Elements
Du säger förmodligen "Jag vet redan", vilket troligen är sant, du vet redan hur man går igenom matriselement. Men det är också sant att säga "loop through array elements" är lite abstrakt, eftersom det vi faktiskt slår igenom är index av arrayen.
Eftersom matrisindex endast består av icke-negativa heltal, vi iterera ett heltal värde som vanligtvis startar från noll och slutar i full längd av arrayen, använd sedan det itererade värdet för att komma åt arrayelementet vid ett visst index.
Men sedan ECMAScript6 finns det ett sätt att direkt loop genom array värden utan att störa index, och det kan göras med hjälp av för av slinga.
I en array, den för av slingan kommer att slingas genom matriselementen i indexens ordning, Med andra ord kommer det att ta hand om iterering över indexen och få en existerande array värde vid ett givet index. Denna slinga är idealisk om du bara vill slinga igenom alla matriselementen och arbeta med dem.
var ary = ["orange", "äpple", "litchi"]; för (låt föremålet av ary) console.log (item); // "orange", "apple", "lychee"
För jämförelse, med det vanliga för loop, vi får indexen istället för värdena som utgång.
var ary = ["orange", "äpple", "litchi"]; för (var item = 0; item < ary.length; item++) console.log(item); // 0, 1, 2
3. Antalet element är inte dess längd
Typiskt när vi talar om längden på en array, Vi tror att det är antingen det antal värden som en array håller, eller den längd som vi har givit till matrisen manuellt. Men i verkligheten beror längden på en array det största befintliga indexet inuti den.
Längd är a mycket flexibel egendom. Oavsett om du redan har bestämt längden på en array i förväg eller inte, om du fortsätter att lägga till värden i arrayen, är dess längd fortsätter att öka i enlighet med detta.
var ary = []; ary.length = 3; console.log (ary.length); // 3 ary [5] = "abcd"; console.log (ary.length); // 6
I exemplet ovan kan du se att jag gav matrisen endast ett värde vid index 5 och längden blir 6. Om du tror att genom att lägga till ett värde i index 5 skapade matrisen indexerna 0 till 4 automatiskt , då Ditt antagande är felaktigt. Det finns verkligen Inga existerande index från 0 till 4 i den uppsättningen. Du kan kontrollera detta med hjälp av i operatör.
var ary = []; ary.length = 3; console.log (ary.length); // 3 ary [5] = "abcd"; console.log (ary.length); // 6 console.log (0 in ary); // false
Arrayen ary är vad vi kallar a "gles" array, en matris där indexen skapas inte kontinuerligt, och har luckor. Det motsatta av en "gles" array är "tät" array där index finns kontinuerligt i matrisen, och antalet element är samma som längd.
De längd egendom kan också trunkerar en array, Se till att det högsta indexet som finns i matrisen alltid är mindre än sig själv, som längd är alltid numeriskt större än det högsta indexet som standard.
I exemplet nedan kan du se hur vi förlorar elementet i index 5 genom att minska längd av ary array.
var ary = []; ary.length = 3; console.log (ary.length); // 3 ary [5] = "abcd"; console.log (ary.length); // 6 ary.length = 2; console.log (ary.length); // 2 console.log (ary [5]); // odefinierad
Vidare läsning
- 10 JavaScript-villkor du borde känna till nu
- 4 inte så vanliga men hjälpsamma Javascript-uttalanden som du borde veta
- Kodoptimering med JS Hint - ett verktyg för linting Javascript
