Συντ. JavaScript

Πίνακας περιεχομένων

ECMAScript 2015 (ES6)

Το 2015, η JavaScript εισήγαγε μια σημαντική νέα λέξη-κλειδί: const.

Έχει γίνει κοινή πρακτική να δηλώνουμε πίνακες χρησιμοποιώντας const:

Παράδειγμα

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

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript const</h2>
<p id="demo"></p>

<script>

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

</script>
</body>
</html>

Δεν είναι δυνατή η εκ νέου ανάθεση

Ένας πίνακας που δηλώνεται με const δεν μπορεί να αντιστοιχιστεί εκ νέου:

Παράδειγμα

const cars = ["Saab", "Volvo", "BMW"];
cars = ["Toyota", "Volvo", "Audi"];    // ERROR

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript const</h2>

<p>You can NOT reassign a constant array:</p>

<p id="demo"></p>

<script>
try {
  const cars = ["Saab", "Volvo", "BMW"];
  cars = ["Toyota", "Volvo", "Audi"];
}
catch (err) {
  document.getElementById("demo").innerHTML = err;
}
</script>

</body>
</html>

Οι πίνακες δεν είναι σταθερές

Η λέξη-κλειδί const είναι λίγο παραπλανητική.

ΔΕΝ ορίζει σταθερό πίνακα. Ορίζει μια σταθερή αναφορά σε έναν πίνακα.

Εξαιτίας αυτού, μπορούμε ακόμα να αλλάξουμε τα στοιχεία ενός σταθερού πίνακα.

Τα στοιχεία μπορούν να αντιστοιχιστούν εκ νέου

Μπορείτε να αλλάξετε τα στοιχεία ενός σταθερού πίνακα:

Παράδειγμα

// You can create a constant array:
const cars = ["Saab", "Volvo", "BMW"];

// You can change an element:
cars[0] = "Toyota";

// You can add an element:
cars.push("Audi");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript const</h2>

<p>Declaring a constant array does NOT make the elements unchangeable:</p>

<p id="demo"></p>

<script>
// Create an Array:
const cars = ["Saab", "Volvo", "BMW"];

// Change an element:
cars[0] = "Toyota";

// Add an element:
cars.push("Audi");

// Display the Array:
document.getElementById("demo").innerHTML = cars; 
</script>

</body>
</html>

Υποστήριξη προγράμματος περιήγησης

Η λέξη-κλειδί const δεν υποστηρίζεται στον Internet Explorer 10 ή παλαιότερη έκδοση.

Ο παρακάτω πίνακας ορίζει τις πρώτες εκδόσεις του προγράμματος περιήγησης με πλήρη υποστήριξη για τη λέξη-κλειδί const:


Chrome 49	IE 11 / Edge	Firefox 36	Safari 10	Opera 36
Mar, 2016	Oct, 2013	Feb, 2015	Sep, 2016	Mar, 2016

Εκχωρήθηκε όταν δηλώθηκε

Στις μεταβλητές const JavaScript πρέπει να εκχωρηθεί μια τιμή όταν δηλώνονται: <p>Σημασία: Ένας πίνακας που δηλώνεται με const πρέπει να αρχικοποιηθεί όταν δηλωθεί.

Η χρήση του const χωρίς προετοιμασία του πίνακα είναι σύνταξη λάθος:

Παράδειγμα

Αυτό δεν θα λειτουργήσει:

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

Οι πίνακες που δηλώνονται με var μπορούν να αρχικοποιηθούν ανά πάσα στιγμή.

Μπορείτε ακόμη και να χρησιμοποιήσετε τον πίνακα πριν δηλωθεί:

Παράδειγμα

Αυτό είναι εντάξει:

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

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1>
<h2>JavaScript Hoisting</h2>

<p id="demo"></p>

<script>

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

document.getElementById("demo").innerHTML = cars[0];

</script>
</body>
</html>

Const Block Scope

Ένας πίνακας που δηλώνεται με const έχει Εύρος αποκλεισμού.

Ένας πίνακας που δηλώνεται σε ένα μπλοκ δεν είναι ο ίδιος με έναν πίνακα που δηλώνεται εκτός του μπλοκ:

Παράδειγμα

const cars = ["Saab", "Volvo", "BMW"];
// Here cars[0] is "Saab"
{
  const cars = ["Toyota", "Volvo", "BMW"];
 
  // Here cars[0] is "Toyota"
}
// Here cars[0] is "Saab"

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1>
<h2>Declaring an Array Using const</h2>

<p id="demo"></p>

<script>
const cars = ["Saab", "Volvo", "BMW"];
// Here cars[0] is "Saab"
{  
  const cars = ["Toyota", "Volvo", "BMW"]; 
  // Here cars[0] is "Toyota"
}
// Here cars[0] is "Saab"
document.getElementById("demo").innerHTML = cars[0];
</script>

</body>
</html>

Ένας πίνακας που δηλώνεται με var δεν έχει εύρος μπλοκ:

Παράδειγμα

var cars = ["Saab", "Volvo", "BMW"];
// Here cars[0] is "Saab"
{
  var cars = ["Toyota", "Volvo", "BMW"];
 
  // Here cars[0] is "Toyota"
}
// Here cars[0] is "Toyota"

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1> 
<h2>Declaring an Array Using var</h2>

<p id="demo"></p>

<script>
var cars = ["Saab", "Volvo", "BMW"];
// Here cars[0] is "Saab"
{  
  var cars = ["Toyota", "Volvo", "BMW"]; 
  // Here cars[0] is "Toyota"
}
// Here cars[0] is "Toyota"
document.getElementById("demo").innerHTML = cars[0];
</script>

</body>
</html>

Μπορείτε να μάθετε περισσότερα για το Block Scope στο κεφάλαιο: JavaScript Scope.

Επαναδηλώνοντας Πίνακες

Η εκ νέου δήλωση ενός πίνακα που έχει δηλωθεί με var επιτρέπεται οπουδήποτε σε ένα πρόγραμμα:

Παράδειγμα

var cars = ["Volvo", "BMW"];   // Allowed
var cars = ["Toyota", "BMW"];  // Allowed
cars = ["Volvo", "Saab"];      // Allowed

Εκ νέου δήλωση ή εκ νέου αντιστοίχιση ενός πίνακα σε const, στο ίδιο εύρος ή σε το ίδιο μπλοκ, δεν επιτρέπεται:

Παράδειγμα

var cars = ["Volvo", "BMW"];     // Allowed
const cars = ["Volvo", "BMW"];   // Not allowed
{
  var cars = ["Volvo", "BMW"];   // Allowed
  const cars = ["Volvo", "BMW"]; // Not allowed
}

Εκ νέου δήλωση ή εκ νέου αντιστοίχιση ενός υπάρχοντος πίνακα const, στο ίδιο εύρος ή σε το ίδιο μπλοκ, δεν επιτρέπεται:

Παράδειγμα

const cars = ["Volvo", "BMW"];   // Allowed
const cars = ["Volvo", "BMW"];   // Not allowed
var cars = ["Volvo", "BMW"];     // Not allowed
cars = ["Volvo", "BMW"];         // Not allowed

{
  const cars = ["Volvo", "BMW"]; // Allowed
  const cars = ["Volvo", "BMW"]; // Not allowed
  var cars = ["Volvo", "BMW"];   // Not allowed
  cars = ["Volvo", "BMW"];       // Not allowed
}

Επιτρέπεται η εκ νέου δήλωση ενός πίνακα με const, σε άλλο εύρος ή σε άλλο μπλοκ:

Παράδειγμα

const cars = ["Volvo", "BMW"];   // Allowed
{
  const cars = ["Volvo", "BMW"]; // Allowed
}
{
  const cars = ["Volvo", "BMW"]; // Allowed
}

Πλήρης αναφορά πίνακα

Για μια πλήρη αναφορά σε πίνακα, μεταβείτε στη διεύθυνση μας:

Ολοκληρώστε την αναφορά πίνακα JavaScript.

Η αναφορά περιέχει περιγραφές και παραδείγματα όλων των Array ιδιότητες και μεθόδους.