JavaScript Let

ECMAScript 2015

ECMAScript 2015 toi mukanaan kaksi tärkeää uutta JavaScript-avainsanaa:let 和 const.

Nämä kaksi avainsanaa tarjoavat lohkon alueen JavaScriptissä (Lohkon alue）muuttujia (ja muuttujia).

ES2015 ennen, JavaScriptillä oli vain kaksi tyyppiä alueista:全局作用域和函数作用域.

全局作用域

Globaali（toimikon ulkopuolella määritellyt muuttujat omaavat全局作用域.

Esimerkki

var carName = "porsche";
// Tässä koodissa voidaan käyttää carName
function myFunction() {
  // Tässä koodissa voidaan käyttää carName
}

Kokeile itse

GlobaaliMuuttujat ovat saatavilla missä tahansa sijainnissa JavaScript-ohjelmassa.

函数作用域

Paikallinen（toimikossa määritellyt muuttujat omaavat函数作用域.

Esimerkki

// Tässä koodissa ei voida käyttää carName
function myFunction() {
  var carName = "porsche";
  // code here CAN use carName
}
// Tässä koodissa ei voida käyttää carName

Kokeile itse

PaikallinenMuuttujat ovat saatavilla vain niissä toimikoissa, joissa ne on määritelty:

JavaScriptin lohkon alue

kautta var Avainsanalla määritellyt muuttujat eivät omaa lohkon aluetta:Alue.

Lohkossa {} Sisään kirjoitetut muuttujat ovat saatavilla lohkon ulkopuolelta.

Esimerkki

{ 
  var x = 10; 
}
// Tässä voidaan käyttää x

ES2015 ennen, JavaScript ei ollut lohkon alueen omaava:

Voit käyttää let Avainsanalla määritellyt muuttujat omaavat lohkon alueen:

Lohkossa {} Sisään kirjoitetut muuttujat eivät ole saatavilla lohkon ulkopuolelta:

Esimerkki

{ 
  let x = 10;
}
// Tässä ei voida käyttää x

Muuttujien uudelleenmäärittäminen

Käytä var Avainsanalla uudelleenmäärittämä muuttuja voi aiheuttaa ongelmia.

Uudelleenmäärittämällä muuttujaa lohkossa myös uudelleenmääritetään lohkon ulkopuoliset muuttujat:

Esimerkki

var x = 10;
// Tässä x on 10
{ 
  var x = 6;
  // Tässä x on 6
}
// Tässä x on 6

Kokeile itse

Käytä let Avainsanalla uudelleenmäärittämä muuttuja voi ratkaista tämän ongelman.

Uudelleenmäärittämällä muuttujaa lohkossa ei uudelleenmääritetä lohkon ulkopuolisia muuttujia:

Esimerkki

var x = 10;
// Tässä x on 10
{ 
  let x = 6;
  // Tässä x on 6
}
// Tässä x on 10

Kokeile itse

Selaimen tuki

Internet Explorer 11 tai aikaisemmat versiot eivät tue täysin: let Avainsana。

Seuraavassa taulukossa määritellään ensimmäinen täysin tukema: let Avainsanan selaimiversio:

Chrome 49 IE / Edge 12 Firefox 44 Safari 11 Opera 36
2016 年 3 月 2015 年 7 月 2015 年 1 月 2017 年 9 月 2016 年 3 月

循环作用域

在循环中使用 var：

Esimerkki

var i = 7;
for (var i = 0; i < 10; i++) {
  // 一些语句
}
// 此处，i 为 10

Kokeile itse

在循环中使用 let：

Esimerkki

let i = 7;
for (let i = 0; i < 10; i++) {
  // 一些语句
}
// 此处 i 为 7

Kokeile itse

在第一个例子中，在循环中使用的变量使用 var 重新声明了循环之外的变量。

在第二个例子中，在循环中使用的变量使用 let 并没有重新声明循环外的变量。

如果在循环中用 let 声明了变量 i，那么只有在循环内，变量 i 才是可见的。

函数作用域

在函数内声明变量时，使用 var 和 let 很相似。

它们都有函数作用域：

function myFunction() {
  var carName = "porsche";   // 函数作用域
}
function myFunction() {
  let carName = "porsche";   // 函数作用域
}

全局作用域

如果在块外声明声明，那么 var 和 let 也很相似。

它们都拥有全局作用域：

var x = 10;       // 全局作用域
let y = 6;       // 全局作用域

HTML 中的全局变量

使用 JavaScript 的情况下，全局作用域是 JavaScript 环境。

在 HTML 中，全局作用域是 window 对象。

kautta var 关键词定义的全局变量属于 window 对象：

Esimerkki

var carName = "porsche";
// 此处的代码可使用 window.carName

Kokeile itse

kautta let 关键词定义的全局变量不属于 window 对象：

Esimerkki

let carName = "porsche";
// 此处的代码不可使用 window.carName

Kokeile itse

重新声明

允许在程序的任何位置使用 var 重新声明 JavaScript 变量：

Esimerkki

var x = 10;
// 现在，x 为 10
var x = 6;
// 现在，x 为 6

Kokeile itse

Samassa toimialueessa tai samassa blokissa, kautta let Uudelleenmäärittely var Muuttujaa ei ole sallittu:

Esimerkki

var x = 10;       // 允许
let x = 6;       // 不允许
{
  var x = 10;   // 允许
  let x = 6;   // 不允许
}

Samassa toimialueessa tai samassa blokissa, kautta let Uudelleenmäärittely let Muuttujaa ei ole sallittu:

Esimerkki

let x = 10;       // Sallittu
let x = 6;       // 不允许
{
  let x = 10;   // Sallittu
  let x = 6;   // 不允许
}

Samassa toimialueessa tai samassa blokissa, kautta var Uudelleenmäärittely let Muuttujaa ei ole sallittu:

Esimerkki

let x = 10;       // Sallittu
var x = 6;       // Ei sallittu
{
  let x = 10;   // Sallittu
  var x = 6;   // Ei sallittu
}

Eri toimialueilla tai blokeissa let Uudelleenmäärittely muuttujaa on sallittu:

Esimerkki

let x = 6;       // Sallittu
{
  let x = 7;   // Sallittu
}
{
  let x = 8;   // Sallittu
}

Kokeile itse

nosto

kautta var Määritellyt muuttujatnostoylös. Jos et tunne, mitä nosto (Hoisting) on, lue osaamme nostosta.

Voit käyttää muuttujaa ennen sen määrittelyä:

Esimerkki

// Tässä voi käyttää carName
var carName;

Kokeile itse

kautta let Määritellyt muuttujat eivät nosteta ylös ytimeen.

määrittelyssä let Muuttujan ennen määrittelyä käyttäminen aiheuttaa ReferenceError.

Muuttujat ovat "tilapäisesti kuolleita" alusta alkaen blokin alusta saakka, kunnes ne määritellään:

Esimerkki

// Tässä ei voi käyttää carName
let carName;