Σειρά Αριθμών JavaScript

JavaScript 数组用于在单一变量中存储多个值。

Παράδειγμα

var cars = ["Saab", "Volvo", "BMW"];

Δοκιμάστε το προσωπικά

什么是数组?

数组是一种特殊的变量,它能够一次存放一个以上的值。

如果您有一个项目清单(例如,汽车品牌列表),在单个变量中存储汽车品牌应该是这样的:

var car1 = "Saab";
var car2 = "Volvo";
var car3 = "BMW"; 

不过,假如您希望遍历所有汽车并找到一个特定的值?假如不是三个汽车品牌而是三百个呢?

解决方法就是数组!

数组可以用一个单一的名称存放很多值,并且还可以通过引用索引号来访问这些值。

创建数组

使用数组文本是创建 JavaScript 数组最简单的方法。

语法:

var array-name = [item1, item2, ...];

Παράδειγμα

var cars = ["Saab", "Volvo", "BMW"];

Δοκιμάστε το προσωπικά

空格和折行并不重要。声明可横跨多行:

Παράδειγμα

var cars = [
    "Saab",
    "Volvo",
    "BMW"

Δοκιμάστε το προσωπικά

Παρακαλώ μην γράψετε κόμμα σε ένα κενό στο τέλος του τελευταίου στοιχείου (π.χ. "BMW",).

Μπορεί να υπάρχουν προβλήματα συμβατότητας μεταξύ των πλοηγών.

Χρήση του κλειδιού JavaScript new

Το παρακάτω παράδειγμα θα δημιουργήσει έναν πίνακα και θα τον προσδιορίσει:

Παράδειγμα

var cars = new Array("Saab", "Volvo", "BMW");

Δοκιμάστε το προσωπικά

Οι δύο παραπάνω παραδείγματα έχουν το ίδιο αποτέλεσμα. Δεν χρειάζεται να χρησιμοποιείτε new Array().

Για απλότητα, αναγνωσιμότητα και ταχύτητα εκτέλεσης, χρησιμοποιήστε το πρώτο μέθοδο (τεκμηριωμένος πίνακας).

Πρόσβαση στο στοιχείο του πίνακα

Με τη χρήση αναφορώνΑριθμός索引 (υποαριθμός)για να αναφέρετε ένα στοιχείο πίνακα.

Αυτή η πρόταση επιστρέφει την τιμή του πρώτου στοιχείου του cars:

var name = cars[0];

Αυτή η πρόταση τροποποιεί το πρώτο στοιχείο του cars:

cars[0] = "Opel";

Παράδειγμα

var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars[0]; 

Δοκιμάστε το προσωπικά

[0] είναι το πρώτο στοιχείο του πίνακα. [1] είναι το δεύτερο. Οι索引 είναι από 0.

Αλλαγή στοιχείου στοιχείου

Αυτή η πρόταση τροποποιεί την τιμή του πρώτου στοιχείου του cars:

cars[0] = "Opel";

Παράδειγμα

var cars = ["Saab", "Volvo", "BMW"];
cars[0] = "Opel";
document.getElementById("demo").innerHTML = cars[0];

Δοκιμάστε το προσωπικά

πρόσβαση στην πλήρη λίστα

Με τον JavaScript, μπορείτε να προσβείτε στην πλήρη λίστα μέσω του ονόματος της λίστας:

Παράδειγμα

var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars; 

Δοκιμάστε το προσωπικά

η λίστα είναι αντικείμενο

η λίστα είναι ειδικός τύπος αντικειμένου. Στο JavaScript χρησιμοποιείτε τη λίστα typeof οι συναρτήσεις θα επιστρέψουν "object".

Αλλά, οι λίστες του JavaScript είναι καλύτερο να περιγραφούν ως λίστες.

η χρήση της λίσταςαριθμούςγια να επισκεφτείτε τα "στοιχεία" του. Σε αυτό το παράδειγμα:person[0] Επιστρέφει Bill:

Λίστα:

var person = ["Bill", "Gates", 62];

Δοκιμάστε το προσωπικά

η χρήση του αντικειμένουΌνομαγια να επισκεφτείτε τα "μέλη" του. Σε αυτό το παράδειγμα:person.firstName Επιστρέφει Bill:

Αντικείμενο:

var person = {firstName:"Bill", lastName:"Gates", age:19};

Δοκιμάστε το προσωπικά

Τα στοιχεία της λίστας μπορούν να είναι αντικείμενα

Οι μεταβλητές του JavaScript μπορούν να είναι αντικείμενα. Οι λίστες είναι ειδικοί τύποι αντικειμένων.

Για αυτό, μπορείτε να αποθηκεύσετε διαφορετικούς τύπους μεταβλητών στη ίδια λίστα.

Μπορείτε να αποθηκεύσετε αντικείμενα στη λίστα. Μπορείτε να αποθηκεύσετε και λειτουργίες στη λίστα. Μπορείτε ακόμα να αποθηκεύσετε λίστες μέσα σε λίστα:

myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;

Ιδιότητες και μεθόδοι λίστας

Η πραγματική δύναμη των λιστών του JavaScript κρύβεται στις ιδιότητες και τις μεθόδους της λίστας:

Παράδειγμα

var x = cars.length;   // η ιδιότητα length επιστρέφει τον αριθμό των στοιχείων
var y = cars.sort();   // η μέθοδος sort() οργανώνει τη λίστα

θα μάθουμε τις μεθόδους της λίστας στο επόμενο κεφάλαιο.

ιδιότητα length

length η ιδιότητα επιστρέφει τη μήκος της λίστας (ο αριθμός των στοιχείων της λίστας).

Παράδειγμα

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length;                       // η μήκος της λίστας fruits είναι 4

Δοκιμάστε το προσωπικά

length η ιδιότητα είναι πάντα μεγαλύτερη από τον τίτλο της λίστας (υποίндекс).

πρόσβαση στο πρώτο στοιχείο της λίστας

Παράδειγμα

fruits = ["Banana", "Orange", "Apple", "Mango"];
var first = fruits[0];

Δοκιμάστε το προσωπικά

πρόσβαση στον τελευταίο στοιχείο της λίστας

Παράδειγμα

fruits = ["Banana", "Orange", "Apple", "Mango"];
var last = fruits[fruits.length - 1];

Δοκιμάστε το προσωπικά

διανύστε τις στοιχεία της λίστας

Η ασφαλέστερη μέθοδος για να διανύσετε μια λίστα είναι να χρησιμοποιήσετε "for"Κύκλος:"

Παράδειγμα

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>";
} 

Δοκιμάστε το προσωπικά

Μπορείτε επίσης να χρησιμοποιήσετε Array.foreach() Στοιχείο:

Παράδειγμα

var fruits, text;
fruits = ["Banana", "Orange", "Apple", "Mango"];
text = "<ul>";
fruits.forEach(myFunction);
text += "</ul>";
function myFunction(value) {
  text += "<li>" + value + "</li>";
}

Δοκιμάστε το προσωπικά

Προσθήκη στοιχείου στον μαγνήτη

Η καλύτερη μέθοδος προσθήκης νέου στοιχείου στον μαγνήτη είναι να χρησιμοποιήσετε push() Μέθοδος:

Παράδειγμα

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon");                // Προσθήκη νέου στοιχείου (Lemon) στον fruits

Δοκιμάστε το προσωπικά

Μπορείτε επίσης να χρησιμοποιήσετε length Πρόσθεση νέου στοιχείου στον μαγνήτη μέσω

Παράδειγμα

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Lemon";     // Προσθήκη νέου στοιχείου (Lemon) στον fruits

Δοκιμάστε το προσωπικά

Αντικειμενική προειδοποίηση!

Η προσθήκη του στοιχείου με την υψηλότερη index μπορεί να δημιουργήσει "θύρα" στον μαγνήτη:

Παράδειγμα

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[6] = "Lemon";                 // Προσθήκη νέου στοιχείου (Lemon) στον fruits

Δοκιμάστε το προσωπικά

Συνδεδεμένοι μαγνήτες

Πολλοί προγραμματιστικοί στοιχεία υποστηρίζουν τους μαγνήτες με ονομαστικές index.

Οι μαγνήτες με ονομαστικές index ονομάζονται συνδεδεμένοι μαγνήτες (ή hash).

JavaScript Δεν υποστηρίζεταιονομαστικές index.

Στο JavaScript, οι μαγνήτες μπορούν να χρησιμοποιηθούν μόνο μεαριθμητικοί δείκτες.

Παράδειγμα

var person = [];
person[0] = "Bill";
person[1] = "Gates";
person[2] = 62;
var x = person.length;          // person.length επιστρέφει 3
var y = person[0];              // person[0] επιστρέφει "Bill"

Δοκιμάστε το προσωπικά

Αντικειμενική προειδοποίηση!

Αν χρησιμοποιήσετε ονομαστικές索引, το JavaScript θα μετατρέψει τον μαγνήτη σε τυπικό αντικείμενο.

Μετά από αυτό, όλες οι μεθόδους και οι ιδιότητες των μαγνητισμών θα παράγουν μη σωστά αποτελέσματα.

Παράδειγμα:

var person = [];
person["firstName"] = "Bill";
person["lastName"] = "Gates";
person["age"] = 62;
var x = person.length;         // person.length θα επιστρέψει το 0
var y = person[0];              // person[0] θα επιστρέψει το undefined

Δοκιμάστε το προσωπικά

Η διαφορά μεταξύ array και αντικειμένων

στο JavaScriptΤο arrayΧρησιμοποιήστεαριθμητικοί δείκτες.

στο JavaScriptτο αντικείμενοΧρησιμοποιήστεΟνομαστοί δείκτες.

Τα array είναι ειδικοί τύποι αντικειμένων που έχουν αριθμητικούς δείκτες.

Πότε να χρησιμοποιήσετε array και πότε αντικείμενα;

  • Το JavaScript δεν υποστηρίζει τα associated arrays
  • Αν θέλετε να ονομάσετε τα στοιχείατην αλφαβητική (テキスト)τότε θα πρέπει να χρησιμοποιήσετετο αντικείμενο.
  • Αν θέλετε να ονομάσετε τα στοιχείααριθμούςτότε θα πρέπει να χρησιμοποιήσετεΤο array.

Αποφύγετε το new Array()

Δεν υπάρχει ανάγκη για τη χρήση του βελτιστοποιητή array του JavaScript new Array().

Χρησιμοποιήστε [] Αντί!

Παρακάτω είναι δύο διαφορετικές εντολές που δημιουργούν μια νέα κενή array με το όνομα points:

var points = new Array();         // Ανεπιθύμητο
var points = [];                  // Προτιμώμενο

Παρακάτω είναι δύο διαφορετικές εντολές που δημιουργούν ένα νέο array με έξι αριθμούς:

var points = new Array(40, 100, 1, 5, 25, 10); // Ανεπιθύμητο
var points = [40, 100, 1, 5, 25, 10];          // Προτιμώμενο

Δοκιμάστε το προσωπικά

new Οι λέξεις-κλειδιά επιπλέον επιπλέον επιπλέον κάνουν τον κώδικα πιο σύνθετο. Επιπλέον, θα προκαλέσουν ορισμένα μη αναμενόμενα αποτελέσματα:

var points = new Array(40, 100);  // Δημιουργείται ένα array με δύο στοιχεία (40 και 100)

Τι θα συμβεί αν αφαιρέσω ένα στοιχείο;

var points = new Array(40);       // Δημιουργείται ένα array με 40 ανενεργά στοιχεία!!!

Δοκιμάστε το προσωπικά

Πώς μπορώ να αναγνωρίσω ένα array;

Η συχνή ερώτηση είναι: Πώς μπορώ να ξέρω αν μια μεταβλητή είναι array;

Το πρόβλημα βρίσκεται στον τύπο算符 του JavaScript typeof Επιστρέφει το "object"":

var fruits = ["Banana", "Orange", "Apple", "Mango"];
typeof fruits;             // Επιστρέφει το "object"

Δοκιμάστε το προσωπικά

Ο τύπος算符 επιστρέφει το "object", γιατί τα JavaScript array ανήκουν στα αντικείμενα.

Λύση 1:

Για να λύσει αυτό το πρόβλημα, το ECMAScript 5 ορίστηκε νέο μέθοδος Array.isArray():

Array.isArray(fruits);     // Επιστρέφει true

Δοκιμάστε το προσωπικά

Το πρόβλημα με αυτόν τον τρόπο είναι το ECMAScript 5 Δεν υποστηρίζονται παλιότεροι περιηγητές.

Λύση 2:

Δημιουργήστε το δικό σας isArray() Η συνάρτηση λύνει το πρόβλημα:

function isArray(x) {
    return x.constructor.toString().indexOf("Array") > -1;
}

Δοκιμάστε το προσωπικά

Αν ο παράμετρος είναι πίνακας, τότε η παραπάνω συνάρτηση επιστρέφει πάντα true.

ή μια πιο ακριβής εξήγηση είναι: αν το μοτίβο του αντικειμένου περιέχει τη λέξη "Array", τότε επιστρέφει true.

Λύση 3:

Αν το αντικείμενο δημιουργήθηκε από τον δομητή που δόθηκε, τότε instanceof Οπέρatoren επιστρέφουν true:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits instanceof Array     // Επιστρέφει true

Δοκιμάστε το προσωπικά