Declararea unei matrice în javascript. metodele pop() și shift(). metodele unshift() și shift().

Matricele sunt unul dintre cele mai frecvent utilizate tipuri de variabile care vă permit să stocați multe valori secvențiale într-un „un singur loc”. Cu toate acestea, când vine vorba de JavaScript, există loc de îmbunătățire.

În acest articol, vom analiza trei tehnici puțin cunoscute care pot fi utilizate atunci când lucrați cu matrice.

1. Adăugarea proprietăților personalizate la matrice

Dacă utilizați căutarea pentru a găsi definiția unui tablou în interior limbaj JavaScript, atunci majoritatea surselor vor pretinde că acest tip Valoarea unei variabile este reprezentată ca obiect.

În general, multe dintre lucrurile pe care le întâlnim în JavaScript sunt obiecte. Ar fi corect să rețineți că limbajul conține și tipuri de date „primitive”, dar valorile lor sunt cumva utilizate în proprietățile din interiorul obiectelor.

2. Accesarea elementelor matricei într-o buclă

Deoarece indicii de matrice pot lua doar valori pozitive, numărarea începe de la zero. Mai târziu putem folosi acest index pentru a accesa elementul de matrice la o iterație de buclă dată.

ECMAScript6 a introdus o modalitate de a derula printr-o matrice fără a utiliza indecși, ci printr-o nouă buclă for...of.

Bucla for...of este concepută pentru a itera prin elementele unei matrice fără a afecta indexul elementului.

Var ary = ["portocale","mere","litchi"]; for (let item of ary)( console.log(item); ) // „orange”, „apple”, „lychee” Pentru comparație: afișarea indicilor articolului într-o buclă for. var ary = ["portocală","măr","litchi"]; pentru (var item = 0; item< ary.length; item++){ console.log(item); } // 0, 1, 2

3. Numărul de elemente nu este dimensiunea matricei

Când vorbim despre dimensiunea unei matrice, de obicei ne gândim la ea ca la numărul de elemente stocate în ea. De fapt, acest lucru nu este în întregime adevărat - proprietatea lungime este calculată în funcție de indicele maxim al elementului.

Proprietatea lungimii este foarte ambiguă. Pentru a verifica acest lucru, priviți următoarele manipulări:

Var ary = ; ary.lungime = 3; console.log(ary.length); // 3 ary = "abcd"; console.log(ary.length); // 6

În ultimul exemplu, a fost suficient să puneți elementul în poziția a cincea, drept urmare lungimea matricei a devenit 6. Dacă credeți că indici de la 0 la 4 vor fi creați automat, veți greși. Acest lucru poate fi verificat folosind operatorul in.

Var ary = ; ary.lungime = 3; console.log(ary.length); // 3 ary = "abcd"; console.log(ary.length); // 6 console.log(0 în ary); // fals

ÎN în acest caz, Este corect să numiți matricea ary „sparse”.

De asemenea, putem manipula proprietatea lungime pentru a tăia matrice. Exemplul de mai jos demonstrează „pierderea” elementului la indicele 5 prin decrementarea proprietății de lungime a matricei ari.

Var ary = ; ary.lungime = 3; console.log(ary.length); // 3 ary = "abcd"; console.log(ary.length); // 6 ari.lungime = 2; console.log(ary.length); // 2 console.log(ary); // nedefinit

  • Traducere
  • I. Iterarea peste matrice reale
  • pentruFiecare metodă și metode aferente
  • pentru buclă
  • Utilizare adecvată pentru...în buclă
  • for...of loop (utilizarea implicită a iteratorului)
  • Utilizarea explicită a iteratorului
  • Folosind metode de iterare peste matrice reale
  • Convertiți într-o matrice reală
  • O notă despre obiectele runtime
I. Enumerarea tablourilor reale On în acest moment Există trei moduri de a itera elementele unui tablou real:
  • metoda Array.prototype.forEach ;
  • clasic pentru buclă
  • un „corect” construit pentru... în buclă.
  • În plus, în curând, odată cu apariția noului standard ECMAScript 6 (ES 6), sunt așteptate încă două metode:
  • for...of loop (utilizarea implicită a iteratorului);
  • utilizarea explicită a iteratorului.
  • 1. Metoda forEach și metodele aferente Dacă proiectul dumneavoastră este proiectat să suporte caracteristicile standardului ECMAScript 5 (ES5), puteți utiliza una dintre inovațiile acestuia - metoda forEach.

    Exemplu de utilizare:
    var a = ["a", "b", "c"]; a.forEach(funcție(intrare) ( console.log(intrare); ));
    În general, utilizarea forEach necesită conectarea bibliotecii de emulare es5-shim pentru browserele care nu acceptă nativ această metodă. Acestea includ IE 8 și mai sus versiuni timpurii, care sunt încă în uz ici și colo.

    Avantajul forEach este că nu este nevoie să declarați variabile locale pentru a stoca indexul și valoarea elementului de matrice curent, deoarece acestea sunt transmise automat funcției. sună din nou(callback) ca argumente.

    Dacă sunteți îngrijorat de costul posibil al apelării unui apel invers pentru fiecare element, nu vă faceți griji și citiți asta.

    ForEach este conceput pentru a repeta peste toate elementele unei matrice, dar pe lângă aceasta, ES5 oferă mai multe metode utile pentru a itera prin toate sau unele elemente și pentru a efectua unele acțiuni cu acestea:

    • fiecare - returnează adevărat dacă pentru fiecare element al matricei apelul returnează o valoare care poate fi convertită în adevărat .
    • some - returnează adevărat dacă pentru cel puțin un element al matricei apelul returnează o valoare care poate fi convertită în adevărat.
    • filter - creează o nouă matrice care include acele elemente ale matricei originale pentru care callback returnează true .
    • hartă - creează o nouă matrice constând din valorile returnate de apel invers.
    • reduce - reduce o matrice la o singură valoare, aplicând un callback fiecărui element de matrice pe rând, începând cu primul (poate fi util pentru calcularea sumei elementelor matricei și a altor funcții rezumative).
    • reduceRight - funcționează similar cu reduce, dar iterează prin elemente în ordine inversă.
    2. Pentru buclă Bine vechi pentru reguli:

    Var a = ["a", "b", "c"]; indicele var; pentru (index = 0; index< a.length; ++index) { console.log(a); }
    Dacă lungimea matricei este constantă pe toată durata buclei, iar bucla în sine aparține unei secțiuni critice pentru performanță a codului (ceea ce este puțin probabil), atunci puteți utiliza „mai optimă” versiune pentru cu stocarea lungimii matricei:

    Var a = ["a", "b", "c"]; var index, len; pentru (index = 0, len = a.lungime; index< len; ++index) { console.log(a); }
    În teorie, acest cod ar trebui să ruleze puțin mai repede decât cel anterior.

    Dacă ordinea elementelor nu este importantă, atunci puteți merge și mai departe în ceea ce privește optimizarea și puteți scăpa de variabila pentru stocarea lungimii matricei, schimbând ordinea căutării în sens invers:

    Var a = ["a", "b", "c"]; indicele var; pentru (index = a.length - 1; index >= 0; --index) ( console.log(a); )
    Cu toate acestea, în motoarele JavaScript moderne, astfel de jocuri de optimizare nu înseamnă de obicei nimic.

    3. Utilizarea corectă a unei bucle for...in Dacă vi se recomandă să utilizați o buclă for...in, amintiți-vă că iterarea peste matrice nu este scopul pentru care este destinată. Contrar unei concepții greșite obișnuite, bucla for...in nu iterează peste indici de matrice, ci mai degrabă prin proprietăți enumerabile ale unui obiect.

    Cu toate acestea, în unele cazuri, cum ar fi iterarea peste matrice rare, pentru...in poate fi utilă, atâta timp cât luați măsuri de precauție, așa cum se arată în exemplul de mai jos:

    // a - tablou rar var a = ; a = „a”; a = „b”; a = "c"; pentru (cheie var în a) ( dacă (a.hasOwnProperty(cheie) && /^0$|^\d*$/.test(cheie) && cheie a * 12); console.log(testMap); // →

    filtra

    Metoda filter() este folosită pentru a filtra matrice. Iterează prin matrice, returnând doar acele elemente care trec o anumită condiție.

    De exemplu, să filtram valorile unei matrice de numere, lăsând doar pe cele mai mari de 21

    Fie arr = ; let testFilter = arr.filter(element => element > 21); console.log(testFilter); // →

    Vă rugăm să rețineți că 21 nu a fost inclus în rezultatul matricei, deoarece condiția era să returneze ceva mai mare decât 21. Pentru ca 21 să fie inclus în matrice, am setat condiția ca mai mare sau egală cu: element >= 21

    reduce

    Metoda reduce() parcurge secvențial elementele matricei, acumulând rezultatul intermediar conform funcției specificate în condiția funcției. În rezultatul final, returnează o singură valoare.

    Această metodă este adesea folosită pentru a găsi suma tuturor numerelor dintr-o matrice. Exemplu:

    Fie arr = ; let summa = arr.reduce((acc, element) => acc + element); console.log(sumă); // → 370

    sorta

    Metoda sort() este folosită pentru a sorta elementele matricei în funcție de parametri specificați.

    Exemplu - să luăm o serie de numere și să le sortăm în ordine crescătoare:

    Fie arr = ; let testSortArr = arr.sort((a, b) => a - b); console.log(testSortArr); // →

    include

    Metoda includes() determină dacă tabloul conține un anumit element, returnând adevărat sau fals în funcție de acesta.

    Exemplu de utilizare includes() .

    Iată o expresie logică:

    Let animal = „câine”; dacă (animal == „pisica” || animal == „câine” || animal == „leu” || animal == „cal”) ( // ........ )

    Folosind metoda includes, o puteți scrie astfel:

    Let animal = „câine”; const animale = ["pisica", "câine", "leu", "cal"]; dacă (animale.include(animal)) ( // ........... )

    Să învățăm cum să indexăm tablourile în js, să eliminăm și să adăugăm elementele acestora.

    O matrice în JavaScript este un obiect global conceput pentru a stoca o listă de valori.

    Este similar cu alte variabile prin faptul că poate stoca orice tip de date. Dar o matrice are o diferență importantă față de o variabilă: poate stoca mai mult de un element la un moment dat.

    Un tablou este o colecție ordonată de valori. Fiecare valoare se numește element și are propriul său număr, numit index.

    Un element din interiorul unei matrice poate fi de orice tip. Mai mult, elementele unei matrice pot fi diferite tipuri: numere, șiruri, porți logiceși chiar obiecte sau alte matrice.

    Ordinea elementelor matricei începe de la 0. Se pare că tabloul va avea întotdeauna un index compensat cu unu: primul element va avea indicele 0, al doilea 1 etc.

    Iată un exemplu de matrice cu elemente de diferite tipuri:

    Crearea (declararea) unui tablou

    Matricele sunt foarte convenabile deoarece pot stoca atâtea date câte aveți nevoie. Dimensiunea maximă posibilă a unui tablou js este de 2 32 de elemente.

    Trebuie să spunem JavaScript că vrem să creăm o matrice. Există două opțiuni pentru aceasta: valoarea în paranteze pătrate sau noul cuvânt cheie.

    Notare scurtă: folosind paranteze pătrate

    O listă de valori separate prin virgulă, cuprinsă între paranteze drepte.

    var myArray = [ "Jack", "Sawyer", "John", "Desmond" ];

    Conținutul matricei este determinat de ceea ce se află între paranteze drepte. Fiecare valoare este separată prin virgulă.

    Valorile sunt specificate în același mod ca și variabilele simple, adică șirurile de caractere trebuie declarate între ghilimele etc.

    Pentru a declara o matrice goală, lăsați parantezele goale:

    var myArray = ;

    Intrare lungă: folosind constructorul Array().

    var lostArray = new Array ("Jack", "Sawyer", "John", "Desmond"); var twinPeaksArray = new Array("Laura", 2, ["Bob", "Leland", "Dale"]);

    Noul cuvânt cheie îi spune JavaScript să creeze o nouă matrice ale cărei valori sunt transmise ca parametri.

    Dacă știți dinainte câte elemente vor fi în tabloul dvs., puteți trece imediat această valoare în constructor.

    var myArray = nou Array(80);

    Expresia de mai sus va crea o matrice goală constând din 80 de sloturi cu valori nedefinite.

    Declararea unui tablou gol:

    var myArray = new Array();

    Accesarea elementelor de matrice

    Folosind indexul fiecărui element, puteți lucra cu orice date din matrice, accesând-o folosind operatorul:

    var myArray = ["Jack", "Sawyer", "John", "Desmond"]; console.log(myArray); // Imprimă „Jack” console.log(myArray); // Tipărește „Desmond”

    O matrice poate avea mai multe niveluri, adică fiecare element poate fi el însuși o matrice. Rezultatul va fi o matrice js bidimensională. Cum putem accesa aceste matrice care se află în interiorul altora - „matrice multidimensionale”?

    Ca exemplu, să considerăm o matrice care reprezintă o familie. Copiii din această familie sunt înregistrați într-o matrice separată în interiorul celei principale:

    var familyArray = ["Marge", "Homer", ["Bart", "Lisa", "Maggie"]];

    Vă puteți imagina așa:

    Pentru a face referire la valoarea „Lisa”:

    var lisa = familyArray; console.log(lisa); // afișează „Lisa”

    Acest lucru poate fi continuat aproape la nesfârșit, ceea ce vă permite să stocați seturi de date imbricate în matrice și să le accesați folosind indecși.

    Adăugarea de elemente la o matrice

    Ne-am dat seama cum să accesăm elementele matricei folosind indicii lor corespunzători. Într-un mod similar, puteți adăuga (sau modifica) elemente declarând, de exemplu:

    var myArray = ["Kate", "Sun"]; myArray = „Julieta”; console.log(myArray); // Tipărește „Kate, Sun, Juliet”

    Ce se întâmplă dacă declar un element cu un index care nu are alte elemente înaintea lui? Matricea în sine va crea toate elementele lipsă și le va atribui valoarea nedefinită:

    var myArray = ["Kate", "Sun"]; myArray = „Julieta”; console.log(myArray.length); // Imprimă „6” console.log(myArray); // Tipărește ["Kate", "Sung", nedefinit, nedefinit, nedefinit, "Juliet"]

    Puteți afla care este lungimea unui tablou js folosind proprietatea length. În exemplul de mai sus, există șase elemente în matrice, iar trei dintre ele nu au primit o valoare - sunt marcate ca nedefinite.

    metoda push().

    Folosind metoda push(), puteți adăuga unul sau mai multe elemente la o matrice js. Push() acceptă un număr nelimitat de parametri, toți care vor fi adăugați la sfârșitul matricei.

    var myArray = ["Kate", "Sut"]; myArray.push("Juliet"); // Adaugă elementul "Juliet" la sfârșitul matricei myArray.push("Libby", "Shannon" // Adaugă elementele "Libby" și "Shannon" la sfârșitul matricei console.log(myaArray); ); // Tipărește ["Kate", "Soon", "Juliet", "Libby", "Shannon"]

    metoda unshift().

    Metoda unshift() funcționează la fel ca push(), cu excepția faptului că adaugă elemente la începutul matricei.

    var myArray = ["Kate", "Sun"]; myArray.unshift(„Juliet”); // Adaugă elementul "Juliet" la începutul matricei myArray.unshift("Libby", "Shannon"); // Adaugă elementele „Libby” și „Shannon” la începutul matricei console.log(myArray); // Iese ["Libby", "Shannon", "Juliet", "Kate", "Soon"]

    Eliminarea elementelor matricei Pop() și metodele shift().

    Metodele pop() și shift() elimină ultimul și, respectiv, primul element al unui tablou:

    var myArray = ["Jack", "Sawyer", "John", "Desmond", "Kate"]; myArray.pop(); // Îndepărtează elementul „Kate” myArray.shift(); // Îndepărtează elementul „Jack” console.log(myArray); // Tipărește ["Sawyer", "John", "Desmond"]

    metoda splice().

    Folosind metoda splice(), puteți elimina sau adăuga elemente într-o matrice, specificând în același timp cu precizie indexul elementelor.

    Următorul exemplu utilizează metoda splice() pentru a adăuga două elemente, începând cu indexul 2 (adică al treilea element):

    var fruitArray = ["măr", "piersică", "portocală", "lămâie", "lime", "cireș"]; fruitArray.splice(2, 0, "pepene galben", "banana"); console.log(fruitArray); // Iese ["măr", "piersică", "pepene", "banana", "portocală", "lămâie", "lai verde", "cireș"]

    Primul parametru al metodei splice() este indexul. Indică în ce poziție trebuie adăugate/înlăturate elementele. În exemplul nostru, am ales indicele 2 (cu valoarea „orange”).

    Al doilea parametru este numărul de elemente care trebuie eliminate. Am specificat o valoare de 0, deci nimic nu va fi șters.

    Următorii parametri sunt opționali. Ele adaugă noi valori matricei. În cazul nostru, trebuie să adăugăm „pepene” și „banană”, începând cu indicele 2.

    O zi buna tuturor. Alexey Gulynin este în legătură. În ultimul articol, ne-am uitat la construcția casei switch în javascript. În acest articol, aș dori să vă spun ce matrice sunt în Javascript. Conceptul de matrice joacă un rol important nu numai în Javascript, ci și în toată programarea. O variabilă, cum ar fi o matrice, conține nu un element, ci mai multe. Sintaxa pentru crearea unui tablou este următoarea:

    Var mas = new Array(valoare1, valoare2,..., valoareN);

    În acest caz, se creează o variabilă matrice mas cu valorile indicate în paranteze. Vă rugăm să rețineți că matricea este creată folosind cuvânt cheie nou. Puteți accesa elementele matricei specificând numele matricei și indexul matricei între paranteze drepte. Indicele matricei este setat de la zero. Să dăm un exemplu de matrice formată din 4 elemente și să afișăm al 2-lea element:

    var mas = new Array("privet", 1, 10, 5); document.write("Al doilea element de matrice = "+mas); // va fi afișat numărul 10

    Dacă punem mas , atunci "privet" va fi tipărit, deoarece indexarea matricei începe de la zero. Să ne dăm seama acum cum să afișam toate elementele unui tablou. Pentru a face acest lucru, trebuie să utilizați o buclă. Pe lângă cunoașterea buclelor în Javascript, trebuie să cunoașteți proprietatea lungime a matricei, care returnează numărul de elemente ale matricei (sau, cu alte cuvinte, lungimea acestuia). Să tipărim lungimea matricei mas:

    var mas = new Array("privet", 1, 10, 5); document.write("Lungimea matricei = "+mas.lungime); // va fi afișat numărul 4

    Imprimarea tuturor elementelor matricei:

    var mas = new Array("privet", 1, 10, 5); var i; pentru (i = 0; i< mas.length; i++) document.write(mas[i]+" ");

    Până acum, ne-am uitat la tablouri unidimensionale. În general, tablourile pot fi multidimensionale. Principalul lucru pe care trebuie să-l înțelegeți este că, de exemplu, o matrice bidimensională este o matrice ale cărei elemente sunt matrice. Să ne uităm la această problemă: trebuie să creați o matrice bidimensională 3 cu 3, ale cărei elemente sunt specificate de utilizator și să scoateți această matrice. Aici vom folosi operatorul prompt pentru a solicita un număr de la utilizator:

    var mas = new Array(); //declară tabloul const n = 3; //declară o constantă, i.e. Matricea noastră are dimensiunea de 3 pe 3 //pentru a defini o matrice bidimensională, trebuie să utilizați o buclă dublă var i; var j; pentru (i = 0; i< n; i++) { mas[i] = new Array();//Здесь мы как раз каждый элемент массива делаем массивом for (j = 0; j < n; j++) { mas[i][j] = prompt("[" + i +","+j+"]= " ,"..."); //запрашиваем число у пользователя } } for (i = 0; i < n; i++) { for (j = 0; j < n; j++) { document.write("[" + i +","+j+"]= "+ mas[i][j]);} //выводим элемент массива document.write("
    "); //mergi la linie nouă după fiecare rând umplut al matricei)

    În cazul nostru, o matrice bidimensională corespunde (de exemplu) următoarei structuri: mas=[,,] . Puteți vedea că matricea are 3 elemente, fiecare dintre ele fiind o matrice în sine.

    Inițial, sarcina Javascript a fost să creeze site-uri web dinamice. În practica mea nu am folosit niciodată tablouri bidimensionale, doar unidimensional, așa că cunoștințele despre matrice pe care le-ați primit din acest articol vor fi destul de suficiente. Într-unul din articolele următoare voi vorbi despre obiectul Array, proprietățile și metodele acestuia.

    • Serghei Savenkov

      un fel de recenzie „scurtă”... de parcă s-ar grăbi undeva