Cum să utilizați constructorul prototipului Array în JavaScript

Cum Sa Utilizati Constructorul Prototipului Array In Javascript



Un obiect Array reprezintă o colecție de elemente. Ajută la menținerea unui set mare de date pentru a evita confuzia mai multor variabile, sortându-le astfel. Dacă utilizatorul dorește să aplice orice metodă și proprietate suplimentară obiectului Array, nu trebuie să aplice acea nouă proprietate/metodă una câte una fiecărui element. În schimb, se poate face eficient folosind matricea JavaScript „ prototip ” constructor. Acest constructor ajută la aplicarea noilor metode și proprietăți la obiectul Array dorit.

Acest ghid explică utilizarea constructorului „prototip” Array în JavaScript.







Cum să utilizați constructorul „prototip” de matrice în JavaScript?

Matricea „ prototip ” constructor este folosit pentru a adăuga noi metode și proprietăți unui obiect Array cu ajutorul funcției JavaScript. Acesta aplică proprietatea construită pentru toate valorile matricei, ca nume și valoare implicită.



Sintaxă



Array.prototype.name = valoare





În sintaxa de mai sus, „ Nume ” specifică proprietatea nou adăugată cu „ valoare ” care se aplică întregului obiect Array.

Să folosim proprietatea definită mai sus practic cu ajutorul sintaxei sale.



Cod HTML

Mai întâi, aruncați o privire la codul HTML menționat:

< p > The 'prototip' constructorul ajută în adăugarea noilor metode / proprietăți ale matricei date ( ) obiect. p >
< buton onclick = „jsFunc()” > Obțineți fiecare lungime de șir buton >
< p id = 'probă' > p >
< p id = 'pentru' > p >

În liniile de cod de mai sus:

  • ” eticheta specifică instrucțiunea de paragraf.

  • Eticheta ” încorporează un buton cu un eveniment „onclick” pentru a invoca funcția specificată „jsFunc()” la clic pe buton.
  • Ultimele două”

    Etichetele ” adaugă paragrafe goale cu ID-urile atribuite „eșantion”, respectiv „para”.

Notă: Acest cod HTML este urmat în toate exemplele date din acest ghid.

Exemplul 1: Aplicarea constructorului „prototip” pentru a număra lungimea obiectului matrice prin adăugarea unei noi metode

Acest exemplu utilizează constructorul „prototip” pentru a număra lungimea fiecărui șir din interiorul unui obiect Array cu ajutorul unei metode nou adăugate.

Cod JavaScript

Urmați codul JavaScript dat:

< scenariu >
Array.prototype.stringLength = funcţie ( ) {
pentru ( unde t = 0 ; t < aceasta.lungime; t++ ) {
acest [ t ] = aceasta [ t ] .lungime;
}
} ;
funcţie jsFunc ( ) {
 var str = [ „HTML” , „CSS” , „JavaScript” ] ;
document.getElementById ( 'probă' ) .innerHTML = str;
str.stringLength ( ) ;
document.getElementById ( 'pentru' ) .innerHTML = str;
}
scenariu >

În rândurile de cod de mai sus:

  • Aplicați sintaxa de bază a matricei „ prototip ' constructor care adaugă o nouă metodă ' stringLength ” definirea unei funcții.
  • Apoi, în definiția funcției, „ pentru bucla ” este iterată peste toți indicii unui obiect Array pentru a găsi lungimea acestora folosind proprietatea „lungime”.
  • După aceea, „ jsFunc() ” definește un obiect Array stocat în variabila „str”.
  • Apoi, „ document.getElementById () ” accesează primul paragraf gol prin id-ul său „eșantion” pentru a afișa obiectul Array „str”.
  • În cele din urmă, asociați obiectul Array „str” cu „ stringLength() ” pentru a număra lungimea șirului fiecărui index de matrice și apoi adăugați-l în următorul paragraf gol al cărui id este „para”.

Ieșire

Aici, rezultatul arată lungimea fiecărui șir al obiectului Array țintă cu ajutorul metodei „stringLength()” nou adăugată prin intermediul constructorului „prototip” Array.

Exemplul 2: Aplicarea constructorului „prototip” pentru a crea o nouă metodă „myUcase” și a o aplica la un obiect matrice

Acest exemplu utilizează constructorul „prototip” pentru a crea o nouă metodă „myUcase” și o aplică obiectului țintă Array.

Cod JavaScript

Să trecem prin codul JavaScript menționat mai jos:

< scenariu >
Array.prototype.myUcase = funcţie ( ) {
pentru ( lăsa t = 0 ; t < aceasta.lungime; t++ ) {
acest [ t ] = aceasta [ t ] .laMajuscule ( ) ;
}
} ;
funcţie jsFunc ( ) {
const arrObj = [ 'html' , 'css' , „JavaScript” , 'Reacţiona' ] ;
arrObj.myUcase ( ) ;
document.getElementById ( 'probă' ) .innerHTML = arrObj;
}
scenariu >

Aici, constructorul „prototip” creează o nouă metodă numită „ myUcase ” care folosește „ Majuscule ” din definiția funcției pentru a converti fiecare șir al obiectului Array în „UpperCase”. În cea din urmă funcție, metoda personalizată este, de asemenea, invocată pe Array.

Ieșire

După cum s-a văzut, fiecare șir al unui obiect Array valorifică un clic pe buton datorită metodei aplicate „myUcase()”.

Concluzie

Pentru a utiliza matricea „ prototip ” constructor în JavaScript, asociați noua metodă/proprietate cu acesta. Specifică o funcție care definește funcționalitățile pentru o altă funcție într-o manieră personalizată conform cerințelor. Acest ghid a explicat pe scurt utilizarea constructorului „prototip” Array în JavaScript.