JavaScript Let

ECMAScript 2015

ECMAScript 2015 introduceerde twee belangrijke nieuwe JavaScript-zoekwoorden:letconst.

Deze twee zoekwoorden bieden in JavaScript blokbereik (Block Scope)variabelen (en constants).

Voor ES2015 had JavaScript alleen twee soorten bereiken:全局作用域函数作用域.

全局作用域

GlobaalVariabelen die buiten een functie worden gedeclareerd hebben全局作用域.

Voorbeeld

var carName = "porsche";
// Hier kan carName worden gebruikt
function myFunction() {
  // Hier kan carName ook worden gebruikt
}

Probeer het zelf

GlobaalVariabelen kunnen op elk punt in een JavaScript-programma worden bereikt.

函数作用域

LokaalVariabelen die binnen een functie worden gedeclareerd hebben函数作用域.

Voorbeeld

// Hier kan carName niet worden gebruikt
function myFunction() {
  var carName = "porsche";
  // code hier CAN use carName
}
// Hier kan carName niet worden gebruikt

Probeer het zelf

LokaalVariabelen kunnen alleen binnen de functie worden bereikt waarin ze zijn gedeclareerd.

JavaScript blokbereik

door var Variabelen die met de zoekwoorden worden gedeclareerd hebben geen blokbereikBereik.

Binnen een blok {} Variabelen die binnen een blok worden gedeclareerd zijn toegankelijk van buiten het blok.

Voorbeeld

{ 
  var x = 10; 
}
// Hier kan x worden gebruikt

Voor ES2015 was JavaScript er geen blokbereik in.

Kan worden gebruikt let De zoekwoorden die worden gedeclareerd hebben een blokbereik.

Binnen een blok {} Variabelen die binnen een blok worden gedeclareerd zijn niet toegankelijk van buiten het blok:

Voorbeeld

{ 
  let x = 10;
}
// Hier kan x niet worden gebruikt

Herdeclareren van variabelen

Gebruik var Het gebruik van de keyword variabele herdeclareren kan problemen veroorzaken.

Het opnieuw declareren van variabelen binnen een blok声明也将重新声明块外的变量:

Voorbeeld

var x = 10;
// Hier x is 10
{ 
  var x = 6;
  // Hier x is 6
}
// Hier x is 6

Probeer het zelf

Gebruik let Het gebruik van de keyword variabele herdeclareren kan dit probleem oplossen.

Het opnieuw declareren van variabelen binnen een blok声明不会重新声明块外的变量:

Voorbeeld

var x = 10;
// Hier x is 10
{ 
  let x = 6;
  // Hier x is 6
}
// Hier x is 10

Probeer het zelf

Browserondersteuning

Internet Explorer 11 of oudere versies ondersteunen de zoekwoorden niet volledig let zoekwoorden.

De tabel definieert de eerste volledig ondersteunde let Browser versie van de zoekwoorden:

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

循环作用域

在循环中使用 var

Voorbeeld

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

Probeer het zelf

在循环中使用 let

Voorbeeld

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

Probeer het zelf

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

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

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

函数作用域

在函数内声明变量时,使用 varlet 很相似。

它们都有函数作用域

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

全局作用域

如果在块外声明声明,那么 varlet 也很相似。

它们都拥有全局作用域

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

HTML 中的全局变量

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

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

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

Voorbeeld

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

Probeer het zelf

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

Voorbeeld

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

Probeer het zelf

重新声明

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

Voorbeeld

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

Probeer het zelf

In dezelfde scope, of in dezelfde blok, door let Het opnieuw declareren van een var Variabelen zijn niet toegestaan:

Voorbeeld

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

In dezelfde scope, of in dezelfde blok, door let Het opnieuw declareren van een let Variabelen zijn niet toegestaan:

Voorbeeld

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

In dezelfde scope, of in dezelfde blok, door var Het opnieuw declareren van een let Variabelen zijn niet toegestaan:

Voorbeeld

let x = 10;       // Toegestaan
var x = 6;       // Niet toegestaan
{
  let x = 10;   // Toegestaan
  var x = 6;   // Niet toegestaan
}

In verschillende scopes of blokken, door let Het opnieuw declareren van variabelen is toegestaan:

Voorbeeld

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

Probeer het zelf

Opwaarts verplaatsen

door var Gedeclareerde variabelen zullenOpwaarts verplaatsennaar het toppunt. Als u niet weet wat opwaarts verplaatsen (Hoisting) is, lees dan ons hoofdstuk over opwaarts verplaatsen.

U kunt het gebruiken voordat u de variabele verklart:

Voorbeeld

// Hier kunt u carName gebruiken
var carName;

Probeer het zelf

door let Gedefinieerde variabelen worden niet omhooggehaald naar het toppunt.

in de verklaring let Het gebruik van de variabele ervoor leidt tot een ReferenceError.

Variabelen zijn in de 'tijdelijke doodstoornis' aan het begin van de blok, totdat ze worden verklaard:

Voorbeeld

// Hier kunt u carName niet gebruiken
let carName;