Vuonna 2015 JavaScript esitteli tärkeän uuden avainsanan: const
.
On tullut yleinen käytäntö ilmoittaa taulukoita käyttämällä const
:ta:
const cars = ["Saab", "Volvo", "BMW"];
Kokeile itse →
<!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
:lla ilmoitettua taulukkoa ei voi määrittää uudelleen:
const cars = ["Saab", "Volvo", "BMW"];
cars = ["Toyota", "Volvo", "Audi"]; // ERROR
Kokeile itse →
<!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>
Avainsana const
on hieman harhaanjohtava.
Se EI määritä vakiotaulukkoa. Se määrittää jatkuvan viittauksen taulukkoon.
Tästä johtuen voimme silti muuttaa vakiotaulukon elementtejä.
Voit muuttaa vakiotaulukon elementtejä:
// 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");
Kokeile itse →
<!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>
Avainsanaa const
ei tueta Internet Explorer 10:ssä tai aiemmissa versioissa.
Seuraavassa taulukossa määritellään ensimmäiset selainversiot, jotka tukevat täysin avainsanaa const
:
Chrome 49 | IE 11 / Edge | Firefox 36 | Safari 10 | Opera 36 |
Mar, 2016 | Oct, 2013 | Feb, 2015 | Sep, 2016 | Mar, 2016 |
JavaScript const
-muuttujille on annettava arvo, kun ne ilmoitetaan: <p>Merkitys: const
:lla ilmoitettu matriisi on alustettava, kun se ilmoitetaan.
const
:n käyttäminen taulukon alustamatta on syntaksi virhe:
Tämä ei toimi:
const cars;
cars = ["Saab", "Volvo", "BMW"];
var
:lla määritetyt taulukot voidaan alustaa milloin tahansa.
Voit jopa käyttää taulukkoa ennen kuin se on ilmoitettu:
Tämä on ok:
cars = ["Saab", "Volvo", "BMW"];
var cars;
Kokeile itse →
<!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
:lla määritetyllä taulukolla on Block Scope.
Lohkossa ilmoitettu matriisi ei ole sama kuin lohkon ulkopuolella ilmoitettu matriisi:
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"
Kokeile itse →
<!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
:lla määritetyllä taulukolla ei ole lohkon laajuutta:
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"
Kokeile itse →
<!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>
Voit oppia lisää Block Scope -luvusta: JavaScript Scope.
var
:lla määritetyn taulukon uudelleenmäärittely on sallittu kaikkialla ohjelmassa:
var cars = ["Volvo", "BMW"]; // Allowed
var cars = ["Toyota", "BMW"]; // Allowed
cars = ["Volvo", "Saab"]; // Allowed
Taulukon uudelleen ilmoittaminen tai määrittäminen const
:lle, samassa laajuudessa tai sama lohko, ei ole sallittu:
var cars = ["Volvo", "BMW"]; // Allowed
const cars = ["Volvo", "BMW"]; // Not allowed
{
var cars = ["Volvo", "BMW"]; // Allowed
const cars = ["Volvo", "BMW"]; // Not allowed
}
Olemassa olevan const
-taulukon uudelleen ilmoittaminen tai määrittäminen uudelleen, samassa laajuudessa tai sama lohko, ei ole sallittu:
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
}
Matriisin uudelleenmäärittäminen const
:lla toisessa laajuudessa tai toisessa lohkossa on sallittua:
const cars = ["Volvo", "BMW"]; // Allowed
{
const cars = ["Volvo", "BMW"]; // Allowed
}
{
const cars = ["Volvo", "BMW"]; // Allowed
}
Täydellisen Array-viitteen saat osoitteesta:
Täydellinen JavaScript-taulukon viite.
Viite sisältää kuvauksia ja esimerkkejä kaikista Arrayista ominaisuuksia ja menetelmiä.