Heim  >  Artikel  >  Web-Frontend  >  ECMAScript6-Bereich auf Blockebene und neue Variablendeklaration (let)_javascript-Kenntnisse

ECMAScript6-Bereich auf Blockebene und neue Variablendeklaration (let)_javascript-Kenntnisse

WBOY
WBOYOriginal
2016-05-16 15:55:31983Durchsuche

Viele Sprachen haben einen Gültigkeitsbereich auf Blockebene, JS jedoch nicht. Es verwendet var zum Deklarieren von Variablen und Funktionen zum Teilen des Gültigkeitsbereichs. Die geschweiften Klammern „{}“ können den Gültigkeitsbereich von var nicht einschränken. Mit var deklarierte Variablen bewirken das Heben von Variablen (Deklarations-Heben).

In ES6 wurde ein let hinzugefügt, das in {}, if oder for deklariert werden kann. Die Verwendung ist die gleiche wie bei var, der Geltungsbereich ist jedoch auf die Blockebene beschränkt und es gibt keine Variablenheraufstufung für mit let deklarierte Variablen.

Beispiel 1: Bereich auf Blockebene, wenn

function getVal(boo) {
  if (boo) {
    var val = 'red'
    // ...
    return val
  } else {
    // 这里可以访问 val
    return null
  }
  // 这里也可以访问 val
}

Die Variable val wird im if-Block deklariert, aber auf val kann außerhalb des else-Blocks und if zugegriffen werden.

Ersetzen Sie var durch let und es sieht so aus

function getVal(boo) {
  if (boo) {
    let val = 'red'
    // ...
    return val
  } else {
    // 这里访问不到 val
    return null
  }
  // 这里也访问不到 val
} 

Beispiel 2: Bereich auf Blockebene für

function func(arr) {
  for (var i = 0; i < arr.length; i++) {
    // i ...
  }
  // 这里也可以访问到i
}

Die Variable i wird im for-Block deklariert, kann aber auch außerhalb des for-Blocks aufgerufen werden.

Ersetzen Sie var durch let, und ich kann für

nicht von außen auf mich zugreifen
function func(arr) {
  for (let i = 0; i < arr.length; i++) {
    // i ...
  }
  // 这里访问不到i
}

Beispiel 3: Variablenförderung (zuerst verwenden, später deklarieren)

function func() {
  // val先使用后声明,不报错
  alert(val) // undefined
  var val;
}

Die Variable val wird zuerst verwendet und dann deklariert. Sie gibt undefiniert aus und meldet keinen Fehler.

Ersetzen Sie var durch let und es wird ein Fehler gemeldet

function func() {
  // val先使用后声明,报语法错
  alert(val)
  let val;
} 

Beispiel 4: Variable Beförderung (zuerst beurteilen und dann deklarieren)

function func() {
  if (typeof val == 'undefined') {
    // ...
  }
  var val = ''
}

Wenn Sie die Art des Urteils verwenden, können Sie es auch vor die var-Anweisung setzen

Aber wenn Sie var durch let ersetzen, wird bei if

ein Syntaxfehler gemeldet
function func() {
  if (typeof val == 'undefined') {
    // ...
  }
  let val = '';
}

ES6 legt fest, dass, wenn let in einem Codeblock vorhanden ist, dieser Block von Anfang an einen geschlossenen Bereich bildet. Bei Verwendung vor der Deklaration wird ein Fehler gemeldet. Das heißt, innerhalb eines Codeblocks sind Variablen, die vor der Deklaration von let verwendet wurden, nicht verfügbar. In der Grammatik gibt es einen Begriff namens „temporal dead zone“, kurz TDZ. Natürlich erscheint TDZ nicht in der ES-Spezifikation, es wird nur zur visuellen Beschreibung verwendet.

Hinweise zur Vermietung

1. Wiederholte Erklärungen sind nicht zulässig

// var和let重复声明
var name = 'Jack';
let name = 'John';
 
// 两个let重复声明
let age = 24;
let age = 30;

Syntaxfehler bei der Ausführung

2. Mit let kann die Selbstausführung anonymer Funktionen eliminiert werden

// 匿名函数写法
(function () {
 var jQuery = function() {};
 // ...
 window.$ = jQuery
})();
 
// 块级作用域写法
{
 let jQuery = function() {};
 // ...
 window.$ = jQuery;
}

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn