Et Array-objekt representerer en samling av elementer. Det hjelper med å opprettholde et stort sett med data for å unngå forvirring av flere variabler, og dermed sortere dem. Hvis brukeren ønsker å bruke en ekstra metode og egenskap på Array-objektet, trenger den ikke å bruke den nye egenskapen/metoden én etter én for hvert element. I stedet kan det gjøres effektivt ved å bruke JavaScript Array ' prototype ' konstruktør. Denne konstruktøren hjelper til med å bruke de nye metodene og egenskapene til det ønskede Array-objektet.
Denne veiledningen forklarer bruken av Array 'prototype'-konstruktøren i JavaScript.
Hvordan bruke Array-'prototype'-konstruktøren i JavaScript?
The Array ' prototype ” konstruktør brukes til å legge til nye metoder og egenskaper til et Array-objekt ved hjelp av JavaScript-funksjonen. Den bruker den konstruerte egenskapen for alle matriseverdier, som dens navn og verdi som standard.
Syntaks
Array.prototype.name = verdi
I syntaksen ovenfor, ' Navn ' spesifiserer den nylig lagt til egenskapen med sin ' verdi ” som gjelder for hele Array-objektet.
La oss bruke den ovenfor definerte egenskapen praktisk talt ved hjelp av syntaksen.
HTML-kode
Ta først en titt på den angitte HTML-koden:
< s > De 'prototype' konstruktør hjelper i tillegg av de nye metodene / egenskaper til den gitte matrisen ( ) gjenstand. s >< knapp ved trykk = 'jsFunc()' > Få hver strenglengde knapp >
< s id = 'prøve' > s >
< s id = 'til' > s >
I kodelinjene ovenfor:
- « ”-taggen spesifiserer avsnittssetningen.
- «
”-taggen bygger inn en knapp med en “onclick”-hendelse for å påkalle den spesifiserte funksjonen “jsFunc()” ved knappeklikk. - De to siste' '-tagger legger til tomme avsnitt med deres tilordnede IDer 'sample' og 'para'.
Merk: Denne HTML-koden følges i alle gitte eksempler i denne veiledningen.
Eksempel 1: Bruk av 'prototype'-konstruktøren for å telle array-objektlengden ved å legge til en ny metode
Dette eksemplet bruker 'prototype'-konstruktøren for å telle lengden på hver streng inne i et Array-objekt ved hjelp av en nylig lagt til metode.
JavaScript-kode
Følg den gitte JavaScript-koden:
< manus >Array.prototype.stringLength = funksjon ( ) {
til ( hvor t = 0 ; t < denne.lengde; t++ ) {
dette [ t ] = dette [ t ] .lengde;
}
} ;
funksjon jsFunc ( ) {
var str = [ 'HTML' , 'CSS' , 'JavaScript' ] ;
document.getElementById ( 'prøve' ) .innerHTML = str;
str.stringLength ( ) ;
document.getElementById ( 'til' ) .innerHTML = str;
}
manus >
I kodelinjene ovenfor:
- Bruk den grunnleggende syntaksen til Array ' prototype ' konstruktør som legger til en ny metode ' strenglengde ' definere en funksjon.
- Deretter, i funksjonsdefinisjonen, ' til ”-løkke itereres over alle indeksene til et Array-objekt for å finne lengden ved hjelp av “length”-egenskapen.
- Etter det, ' jsFunc() ' definerer et Array-objekt lagret i 'str'-variabelen.
- Og så ' document.getElementById () ”-metoden får tilgang til det første tomme avsnittet via sin id “sample” for å vise Array-objektet “str”.
- Til slutt, assosier 'str' Array-objektet med ' stringLength() ”-metoden for å telle strenglengden til hver matriseindeks og deretter legge den til i neste tomme avsnitt hvis id er “para”.
Produksjon
Her viser utdata lengden på hver streng av mål Array-objektet ved hjelp av den nylig lagt til 'stringLength()'-metoden via Array-'prototype'-konstruktøren.
Eksempel 2: Bruk av 'prototype'-konstruktøren for å lage en ny metode 'myUcase' og bruke den på et matriseobjekt
Dette eksemplet bruker 'prototype'-konstruktøren for å lage en ny 'myUcase'-metode og bruker den på mål Array-objektet.
JavaScript-kode
La oss gå gjennom JavaScript-koden nedenfor:
< manus >Array.prototype.myUcase = funksjon ( ) {
til ( la t = 0 ; t < denne.lengde; t++ ) {
dette [ t ] = dette [ t ] .toUpperCase ( ) ;
}
} ;
funksjon jsFunc ( ) {
const arrObj = [ 'html' , 'css' , 'JavaScript' , 'Reagere' ] ;
arrObj.myUcase ( ) ;
document.getElementById ( 'prøve' ) .innerHTML = arrObj;
}
manus >
Her lager 'prototype'-konstruktøren en ny metode kalt ' myUcase ' som bruker ' Stor bokstav ”-metoden i funksjonsdefinisjonen for å konvertere hver streng av Array-objektet til “UpperCase”. I den sistnevnte funksjonen påkalles også den tilpassede metoden på Arrayen.
Produksjon
Som sett, kapitaliserer hver streng av et Array-objekt på et knappeklikk på grunn av den anvendte 'myUcase()'-metoden.
Konklusjon
For å bruke Array ' prototype ” konstruktør i JavaScript, knytte den nye metoden/egenskapen til den. Den spesifiserer en funksjon som definerer funksjonene for en annen funksjon på en tilpasset måte i henhold til kravene. Denne veiledningen forklarte kort bruken av Array 'prototype'-konstruktøren i JavaScript.