Ett Array-objekt representerar en samling element. Det hjälper till att upprätthålla en stor uppsättning data för att undvika förvirring av flera variabler och därmed sortera dem. Om användaren vill tillämpa någon ytterligare metod och egenskap på Array-objektet, behöver den inte tillämpa den nya egenskapen/metoden en efter en för varje element. Istället kan det göras effektivt genom att använda JavaScript Array ' prototyp ” konstruktör. Denna konstruktor hjälper till att tillämpa de nya metoderna och egenskaperna på det önskade Array-objektet.
Den här guiden förklarar användningen av Arrays 'prototyp'-konstruktor i JavaScript.
Hur man använder Array 'prototype' Constructor i JavaScript?
The Array ' prototyp ”-konstruktorn används för att lägga till nya metoder och egenskaper till ett Array-objekt med hjälp av JavaScript-funktionen. Den tillämpar den konstruerade egenskapen för alla matrisvärden, som dess namn och värde som standard.
Syntax
Array.prototype.name = värde
I ovanstående syntax, ' namn ' specificerar den nyligen tillagda egenskapen med dess ' värde ” som gäller för hela Array-objektet.
Låt oss använda den ovan definierade egenskapen praktiskt taget med hjälp av dess syntax.
HTML-kod
Ta först en titt på den angivna HTML-koden:
< sid > De 'prototyp' konstruktör hjälper till i tillägget av de nya metoderna / egenskaper till den givna Arrayen ( ) objekt. sid >< knapp onclick = 'jsFunc()' > Få varje stränglängd knapp >
< sid id = 'prov' > sid >
< sid id = 'för' > sid >
I ovanstående kodrader:
- den ' ”-taggen anger styckesatsen.
- den '
”-taggen bäddar in en knapp med en “onclick”-händelse för att anropa den angivna funktionen “jsFunc()” vid knappklick. - De två sista' '-taggar lägger till tomma stycken med deras tilldelade ID 'sample' respektive 'para'.
Notera: Denna HTML-kod följs i alla givna exempel i den här guiden.
Exempel 1: Använda 'prototyp'-konstruktören för att räkna arrayobjektets längd genom att lägga till en ny metod
Det här exemplet använder 'prototyp'-konstruktorn för att räkna längden på varje sträng inuti ett Array-objekt med hjälp av en nyligen tillagd metod.
JavaScript-kod
Följ den angivna JavaScript-koden:
< manus >Array.prototype.stringLength = fungera ( ) {
för ( var t = 0 ; t < denna.längd; t++ ) {
detta [ t ] = detta [ t ] .längd;
}
} ;
fungera jsFunc ( ) {
var str = [ 'HTML' , 'CSS' , 'JavaScript' ] ;
document.getElementById ( 'prov' ) .innerHTML = str;
str.stringLängd ( ) ;
document.getElementById ( 'för' ) .innerHTML = str;
}
manus >
I kodraderna ovan:
- Tillämpa den grundläggande syntaxen för Array ' prototyp ' konstruktör som lägger till en ny metod ' stringLängd ” definiera en funktion.
- Därefter, i funktionsdefinitionen, ' för ”-loopen itereras över alla index för ett Array-objekt för att hitta deras längd med hjälp av egenskapen “length”.
- Efter det kommer ' jsFunc() ' definierar ett Array-objekt lagrat i variabeln 'str'.
- Sedan ' document.getElementById () ”-metoden kommer åt det första tomma stycket via dess id “sample” för att visa Array-objektet “str”.
- Till sist, associera 'str' Array-objektet med ' stringLength() ”-metoden för att räkna stränglängden för varje matrisindex och sedan lägga till det i nästa tomma stycke vars id är “para”.
Produktion
Här visar utdata längden på varje sträng av mål Array-objektet med hjälp av den nyligen tillagda metoden 'stringLength()' via Array 'prototype'-konstruktorn.
Exempel 2: Tillämpning av 'prototyp'-konstruktorn för att skapa en ny metod 'myUcase' och tillämpa den på ett arrayobjekt
Det här exemplet använder 'prototyp'-konstruktorn för att skapa en ny 'myUcase'-metod och tillämpar den på målarrayobjektet.
JavaScript-kod
Låt oss gå igenom nedanstående JavaScript-kod:
< manus >Array.prototype.myUcase = fungera ( ) {
för ( låta t = 0 ; t < denna.längd; t++ ) {
detta [ t ] = detta [ t ] .toUpperCase ( ) ;
}
} ;
fungera jsFunc ( ) {
const arrObj = [ 'html' , 'css' , 'JavaScript' , 'Reagera' ] ;
arrObj.myUcase ( ) ;
document.getElementById ( 'prov' ) .innerHTML = arrObj;
}
manus >
Här skapar 'prototyp'-konstruktören en ny metod som heter ' myUcase ' som använder ' Versal ”-metoden i funktionsdefinitionen för att konvertera varje sträng i Array-objektet till ”UpperCase”. I den senare funktionen anropas även den anpassade metoden på Arrayen.
Produktion
Som framgår, kapitaliseras varje sträng i ett Array-objekt på ett knappklick på grund av den tillämpade 'myUcase()'-metoden.
Slutsats
För att använda Array ' prototyp ” konstruktor i JavaScript, associera den nya metoden/egenskapen med den. Den specificerar en funktion som definierar funktionaliteterna för en annan funktion på ett anpassat sätt enligt kraven. Den här guiden förklarade kort användningen av Array 'prototype'-konstruktorn i JavaScript.