Et Array-objekt repræsenterer en samling af elementer. Det hjælper med at vedligeholde et stort sæt data for at undgå forvirring af flere variabler og derved sortere dem. Hvis brugeren ønsker at anvende en yderligere metode og egenskab til Array-objektet, behøver den ikke at anvende den nye egenskab/metode en efter en til hvert element. I stedet kan det gøres effektivt ved at bruge JavaScript Array ' prototype ” konstruktør. Denne konstruktør hjælper med at anvende de nye metoder og egenskaber til det ønskede Array-objekt.
Denne vejledning forklarer brugen af Array-'prototype'-konstruktøren i JavaScript.
Hvordan bruger man Array-'prototype'-konstruktøren i JavaScript?
Arrayet' prototype ” konstruktør bruges til at tilføje nye metoder og egenskaber til et Array-objekt ved hjælp af JavaScript-funktionen. Den anvender den konstruerede egenskab for alle matrixværdier, som dens navn og værdi som standard.
Syntaks
Array.prototype.name = værdi
I ovenstående syntaks, ' navn ' angiver den nyligt tilføjede egenskab med sin ' værdi ”, der gælder for hele Array-objektet.
Lad os bruge den ovenfor definerede egenskab praktisk talt ved hjælp af dens syntaks.
HTML kode
Først skal du tage et kig på den angivne HTML-kode:
< s > Det 'prototype' konstruktør hjælper i tilføjelsen af de nye metoder / egenskaber til det givne array ( ) objekt. s >< knap onclick = 'jsFunc()' > Få hver strenglængde knap >
< s id = 'prøve' > s >
< s id = 'til' > s >
I ovenstående kodelinjer:
- Det ' ” tag angiver afsnitssætningen.
- Det '
” tag indlejrer en knap med en “onclick” hændelse for at påkalde den specificerede funktion “jsFunc()” ved knap klik. - De sidste to' '-tags tilføjer tomme afsnit med deres tildelte id'er 'sample' og 'para'.
Bemærk: Denne HTML-kode følges i alle givne eksempler i denne vejledning.
Eksempel 1: Anvendelse af 'prototype'-konstruktøren til at tælle array-objektlængden ved at tilføje en ny metode
Dette eksempel bruger 'prototype'-konstruktøren til at tælle længden af hver streng inde i et Array-objekt ved hjælp af en nyligt tilføjet metode.
JavaScript kode
Følg den givne JavaScript-kode:
< manuskript >Array.prototype.stringLength = fungere ( ) {
til ( hvor t = 0 ; t < denne.længde; t++ ) {
det her [ t ] = dette [ t ] .længde;
}
} ;
fungere jsFunc ( ) {
var str = [ 'HTML' , 'CSS' , 'JavaScript' ] ;
document.getElementById ( 'prøve' ) .innerHTML = str;
str.strengLængde ( ) ;
document.getElementById ( 'til' ) .innerHTML = str;
}
manuskript >
I ovenstående kodelinjer:
- Anvend den grundlæggende syntaks for Array ' prototype ' konstruktør, der tilføjer en ny metode ' strenglængde ” definere en funktion.
- Dernæst, i funktionsdefinitionen, ' til ”-løkke itereres over alle indekserne for et Array-objekt for at finde deres længde ved hjælp af egenskaben “længde”.
- Derefter vil ' jsFunc() ' definerer et Array-objekt, der er gemt i 'str'-variablen.
- Derefter ' document.getElementById () ”-metoden får adgang til det første tomme afsnit via dets id 'sample' for at vise Array-objektet 'str'.
- Til sidst, tilknyt 'str' Array-objektet med ' stringLength() ” metode til at tælle strenglængden af hvert matrixindeks og derefter tilføje det til det næste tomme afsnit, hvis id er “para”.
Produktion
Her viser output længden af hver streng af mål Array-objektet ved hjælp af den nyligt tilføjede 'stringLength()'-metode via Array-'prototype'-konstruktøren.
Eksempel 2: Anvendelse af 'prototype'-konstruktøren til at oprette en ny metode 'myUcase' og anvende den på et array-objekt
Dette eksempel bruger 'prototype'-konstruktøren til at skabe en ny 'myUcase'-metode og anvender den på mål Array-objektet.
JavaScript kode
Lad os gennemgå den nedenfor angivne JavaScript-kode:
< manuskript >Array.prototype.myUcase = fungere ( ) {
til ( lade t = 0 ; t < denne.længde; t++ ) {
det her [ t ] = dette [ t ] .toUpperCase ( ) ;
}
} ;
fungere jsFunc ( ) {
const arrObj = [ 'html' , 'css' , 'JavaScript' , 'Reagere' ] ;
arrObj.myUcase ( ) ;
document.getElementById ( 'prøve' ) .innerHTML = arrObj;
}
manuskript >
Her opretter 'prototype'-konstruktøren en ny metode kaldet ' minUcase ', der bruger ' Store bogstaver ”-metoden i funktionsdefinitionen til at konvertere hver streng af Array-objektet til “Store bogstaver”. I sidstnævnte funktion påkaldes den brugerdefinerede metode ligeledes på Array'en.
Produktion
Som det ses, udnytter hver streng af et Array-objekt et klik på en knap på grund af den anvendte 'myUcase()'-metode.
Konklusion
For at bruge Array ' prototype ” konstruktør i JavaScript, tilknyt den nye metode/egenskab til den. Den specificerer en funktion, der definerer funktionaliteterne for en anden funktion på en brugerdefineret måde i henhold til kravene. Denne vejledning forklarede kort brugen af Array-'prototype'-konstruktøren i JavaScript.