matrice JavaScript sunt utilizate pentru a stoca mai multe valori într-o singură variabilă.
Afiseaza Arrays
In acest tutorial vom folosi un script pentru a afișa matrice în interiorul unui <p> elementul cu id="demo" :
Exemplu
<p id="demo"></p>
<script>
var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
</script>
Prima linie (in the script) - (in the script) creează un tablou numit mașini.
A doua linie "finds" elementul cu id="demo" și "displays" matrice în "innerHTML" din ea .;
Încearcă-l singur
Creați o matrice, și să alocați valori-l:
Spațiile și pauzele de linie nu sunt importante. O declarație se poate întinde pe mai multe linii:
Niciodată nu a pus o virgulă după ultimul element (like "BMW" ,) .
Efectul este incompatibil pe diferite browsere.
Ce este o matrice?
O matrice este o variabilă specială, care poate deține mai mult de o valoare la un moment dat.
Dacă aveți o listă de elemente (a list of car names, for example) de (a list of car names, for example) , stocarea mașinile în anumite variabile ar putea arăta astfel:
var car1 = "Saab";
var car2 = "Volvo";
var car3 = "BMW";
Cu toate acestea, ce se întâmplă dacă doriți să bucla prin masini și de a găsi unul specific? Și dacă nu ai avut 3 masini, dar 300?
Solutia este o matrice!
O matrice poate stoca mai multe valori sub un singur nume, și puteți accesa valorile prin referire la un număr de index.
Crearea unei matrice
Folosind o matrice literal este cel mai simplu mod de a crea o matrice JavaScript.
Sintaxă:
var array-name = [ item1 , item2 , ...];
Exemplu:
var cars = ["Saab", "Volvo", "BMW"];Utilizarea JavaScript nou pentru cuvinte cheie
Exemplul următor creează, de asemenea, o matrice, și atribuie valori-l:
Cele două exemple de mai sus face exact același lucru. Nu este nevoie de a utiliza new Array() .
Pentru simplitate, lizibilitatea și viteza de execuție, utilizați prima (the array literal method) .
Accesarea elementelor unei matrice
Vă referiți la un element de matrice cu referire la index number de index number .
Această declarație accesează valoarea primului element în mașini:
var
name = cars[0];
Această afirmație modifică primul element în mașini:
cars[0] = "Opel";
[0] este primul element într - o matrice. [1] este al doilea. indecși Array începe cu 0.
Puteți avea diferite obiecte într-un singur Array
Variabilele JavaScript pot fi obiecte. Tablourile sunt tipuri speciale de obiecte.
Din acest motiv, puteți avea variabile de diferite tipuri în aceeași matrice.
Puteți avea obiecte într-o matrice. Puteți avea funcții într-o matrice. Puteți avea matrice într-o matrice:
myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;
Tablourile sunt obiecte
Tablourile sunt un tip special de obiecte. typeof Operatorul în JavaScript se întoarce "object" pentru matrice.
Dar, matrice JavaScript sunt cel mai bine descrise ca matrice.
Matricele folosesc numbers pentru a accesa sale "elements" . În acest exemplu, person[0] returnează John :
Obiectele folosesc nume pentru a accesa sale "members" . În acest exemplu, person.firstName returnează John :
Proprietăți Array și metode
Puterea reală a matrice JavaScript sunt încorporată în proprietățile matrice și metode:
Exemple
var x = cars.length;
// The length property returns the number of elements in cars
var y = cars.sort();
// The sort() method sort cars in alphabetical order
Metodele de matrice sunt acoperite în capitolul următor.
Lungimea proprietate
length proprietatea unei matrice returneaza lungimea unui array (numărul de elemente de matrice).
Exemplu
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length; // the length of fruits is 4
Încearcă - l singur » Proprietatea lungime este întotdeauna unul mai mult decât cel mai mare indice matrice.
Adăugarea de elemente Array
Cel mai simplu mod de a adăuga un element nou la o matrice utilizează metoda de împingere:
Exemplu
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon"); // adds a new element (Lemon) to fruits Încearcă - l singur » Element nou poate fi , de asemenea , adăugate la o matrice folosind length proprietății:
Exemplu
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Lemon"; // adds a new element (Lemon) to fruits Încearcă - l singur » AVERTIZARE !
Elemente cu indici mari pot crea nedefinite Adăugarea de "holes" într - o matrice:
Exemplu
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[10] = "Lemon"; // adds a new element (Lemon) to fruits Încearcă - l singur » Looping Elemente Array
Cel mai bun mod de a bucla printr - o matrice, se utilizează un "for" buclă:
Exemplu
var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
text += "<li>" + fruits[i] + "</li>";
}
Încearcă - l singur » Arrays asociativă
Multe limbaje de programare a sprijini matrice cu indici cu numele.
Matricele cu indici numite sunt numite matrice asociative (or hashes) - (or hashes) .
JavaScript nu are suport pentru matrice cu indici cu numele.
În JavaScript, matricele folosiți întotdeauna indexurile numerotate.
Exemplu
var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length;
// person.length will return 3
var y = person[0];
// person[0] will return "John" Încearcă - l singur » AVERTIZARE !!
Dacă utilizați un indice de nume, JavaScript va redefini matrice la un obiect standard de.
După aceea, toate metodele de matrice și proprietăți vor produce rezultate incorecte.
Exemplu:
var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length; // person.length will
return 0
var y = person[0];
// person[0] will return undefined Încearcă - l singur » Diferența dintre Arrays și obiecte
În JavaScript, matricele folosi indexurile numerotate.
În JavaScript, obiecte de uz numit indecși.
Tablourile sunt un tip special de obiecte, cu indici numerotate.
Când se utilizează Arrays. Când să utilizați obiecte.
- JavaScript nu are suport pentru tablouri asociative.
- Ar trebui să utilizați obiecte atunci când doriți numele elementelor să fie șiruri (text) .
- Ar trebui să utilizați matricele atunci când doriți numele elementelor să fie numere.
Evitați new Array()
Nu este nevoie de a utiliza built-in matrice constructorului Javascript new Array() .
Utilizați [] în loc.
Aceste două situații diferite, ambele puncte de a crea un nou array gol numit:
var points = new Array();
// Bad
var points = [];
// Good
Aceste două situații diferite, atât a crea o nouă matrice care conține 6 numere:
var points = new Array(40, 100, 1, 5, 25, 10) // Bad
var points = [40, 100, 1, 5, 25, 10];
// Good
Încearcă - l singur » new cuvânt cheie complică doar codul. Se poate produce, de asemenea, unele rezultate neașteptate:
var points = new Array(40, 100); // Creates an array with two elements (40 and 100)Ce se întâmplă dacă am elimina unul dintre elementele?
var points = new Array(40); // Creates an array with 40 undefined elements !!!!! Încearcă - l singur » Cum să recunoască o matrice
O întrebare comună este: Cum pot afla dacă o variabilă este o matrice?
Problema este că operatorul JavaScript typeof returnează "object" :
var fruits = ["Banana", "Orange", "Apple", "Mango"];
typeof fruits; // returns object Încearcă - l singur » Operatorul typeof returnează obiect deoarece o matrice JavaScript este un obiect.
Soluția 1:
Pentru a rezolva această problemă ECMAScript 5 definește o nouă metodă Array. isArray() Array. isArray() :
Problema cu această soluție este că ECMAScript 5 nu este acceptat în browsere mai vechi.
Soluția 2:
Pentru a rezolva această problemă , puteți crea propriul isArray() Funcția:
Funcția de mai sus întotdeauna returnează true dacă argumentul este o matrice.
Sau , mai precis: returnează true dacă prototipul obiect conține cuvântul "Array" .
Soluția 3:
instanceof Operatorul returneaza true daca un obiect este creat de un anumit constructor:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits instanceof Array // returns true Încearcă - l singur » Testați-te cu exerciții!
Exercițiul 1 » Exercițiul 2» Exercițiul 3 » Exercițiul 4» Exercițiul 5 »