|
? S2015 ha introdotto due nuove importanti parole chiave JavaScript: lete const. ? Queste due parole chiave forniscono variabili (e costanti) di Scope di blocco in JavaScript. ? Prima di ES2015, JavaScript aveva solo due tipi di ambito: Global Scope e Function Scope . ? Ambito globale ? Le variabili dichiarate globalmente (al di fuori di qualsiasi funzione) hanno Global Scope . https://www.w3schools.com/js/tryit.asp?filename=tryjs_scope_global <!DOCTYPE html> <html> <body> <h2>JavaScript Scope</h2> <p>A GLOBAL variable can be accessed from any script or function.</p> <p id="demo"></p> <script> var carName = "Volvo"; myFunction(); function myFunction() { document.getElementById("demo").innerHTML = "I can display " + carName; } </script> </body> </html> ? Le variabili dichiarate localmente (all?interno di una funzione) hanno Function Scope . https://www.w3schools.com/js/tryit.asp?filename=tryjs_scope_local <!DOCTYPE html> <html> <body> <h2>JavaScript Scope</h2> <p>Outside myFunction() carName is undefined.</p> <p id="demo1"></p> <p id="demo2"></p> <script> myFunction(); function myFunction() { var carName = "Volvo"; document.getElementById("demo1").innerHTML = typeof carName + " " + carName; } document.getElementById("demo2").innerHTML = typeof carName; </script> </body> </html> ? Le variabili locali sono accessibili solo dall?interno della funzione in cui sono dichiarate. ? JavaScript Block Scope ? Le variabili dichiarate con la varparola chiave non possono avere Ambito di blocco . ? Le variabili dichiarate all?interno di un blocco {} sono accessibili dall?esterno del blocco. https://www.w3schools.com/js/tryit.asp?filename=tryjs_es6_let <!DOCTYPE html> <html> <body> <h2>Declaring a Variable Using let</h2> <p id="demo"></p> <script> var x = 10; // Here x is 10 { let x = 2; // Here x is 2 } // Here x is 10 document.getElementById("demo").innerHTML = x; </script> </body> </html> https://www.w3schools.com/js/tryit.asp?filename=tryjs_let_for_loop1 <!DOCTYPE html> <html> <body> <h2>JavaScript let</h2> <p id="demo"></p> <p id="demo2"></p> <script> var i = 5; document.getElementById("demo2").innerHTML = i; for (var i = 0; i < 10; i++) { // some statements } document.getElementById("demo").innerHTML = i; </script> https://www.w3schools.com/js/tryit.asp?filename=tryjs_let_for_loop2 </body> </html> ? Ulilizzando LET <!DOCTYPE html> <html> <body> <h2>JavaScript let</h2> <p id="demo"></p> <script> let i = 5; for (let i = 0; i < 10; i++) { // some statements } document.getElementById("demo").innerHTML = i; </script> </body> </html> ? window.carName; https://www.w3schools.com/js/tryit.asp?filename=tryjs_let_scope <!DOCTYPE html> <html> <body> <h2>JavaScript Global Variables</h2> <p>In HTML, global variables defined with <b>var</b>, will become window variables.</p> <p id="demo"></p> <script> var carName = "Volvo"; // code here can use window.carName document.getElementById("demo").innerHTML = "I can display " + window.carName; </script> </body> </html> ? Utilizzo LET https://www.w3schools.com/js/tryit.asp?filename=tryjs_let_global <!DOCTYPE html> <html> <body> <h2>JavaScript Global Variables</h2> <p>In HTML, global variables defined with <b>let</b>, will not become window variables.</p> <p id="demo"></p> <script> let carName = "Volvo"; // code here can use window.carName document.getElementById("demo").innerHTML = "I can not display " + window.carName; </script> </body> </html> ? ? possibile modificare le propriet? di un oggetto costante: https://www.w3schools.com/js/tryit.asp?filename=tryjs_const_object <!DOCTYPE html> <html> <body> <h2>JavaScript const</h2> <p>Declaring a constant object does NOT make the objects properties unchangeable:</p> <p id="demo"></p> <script> // Create an object: const car = {type:"Fiat", model:"500", color:"white"}; // Change a property: car.color = "red"; // Add a property: car.owner = "Johnson"; // Display the property: document.getElementById("demo").innerHTML = "Car owner is " + car.owner; </script> </body> </html> ? Ma NON puoi riassegnare un oggetto costante: https://www.w3schools.com/js/tryit.asp?filename=tryjs_const_object_assign <!DOCTYPE html> <html> <body> <h2>JavaScript const</h2> <p>But you can NOT reassign a constant object:</p> <p id="demo"></p> <script> try { const car = {type:"Fiat", model:"500", color:"white"}; car = {type:"Volvo", model:"EX60", color:"red"}; } catch (err) { document.getElementById("demo").innerHTML = err; } </script> </body> </html> ? Puoi cambiare gli elementi di un array costante: https://www.w3schools.com/js/tryit.asp?filename=tryjs_const_array <!DOCTYPE html> <html> <body> <h2>JavaScript const</h2> <p>Declaring a constant array does NOT make the elements unchangeble:</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> ? Ma NON puoi riassegnare un array costante: https://www.w3schools.com/js/tryit.asp?filename=tryjs_const_array_assign <!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> |