Was ist der Unterschied zwischen var und let/const in Javascript?

Was ist der Unterschied zwischen var und let/const in JavaScript? Dieser Artikel stellt var und let/const allen vor, damit jeder den Unterschied zwischen var und let/const verstehen kann. Ich hoffe, dass er für Sie hilfreich ist. [Kursempfehlung: JavaScript-Video-Tutorial]

let und const sind neu in ES6-Befehlen Diese beiden Befehle unterscheiden sich stark von var in ES5, und es gibt auch einige subtile Unterschiede zwischen let und const.

Inhalt: Der Unterschied zwischen

var und let/const

1. Geltungsbereich auf Blockebene

2. Keine variable Förderung

3. Vorübergehende Totzone

4. Nicht wiederholbare Deklaration

5. Mit let und const deklarierte globale Variablen werden nicht unter dem Objekt der obersten Ebene aufgehängt

constZwei Punkte, die Sie zum Befehl beachten sollten:

1. const muss sofort nach der Deklaration zugewiesen werden, sonst wird ein Fehler gemeldet

2. const Sobald ein einfacher Typ deklariert ist, kann er nicht mehr geändert werden. Die Adresse, auf die der Zeiger eines komplexen Typs (Array, Objekt usw.) zeigt, kann nicht mehr geändert werden, die internen Daten können jedoch geändert werden.

Warum benötigen Sie einen Bereich auf Blockebene?

ES5 verfügt nur über einen globalen Bereich und Funktionsbereich, nicht über einen Bereich auf Blockebene.

Dies bringt viele unvernünftige Szenarien mit sich:

1. Innere Variablen können äußere Variablen überschreiben.

2. zum Zählen verwendet. Die Schleifenvariable ist durchgesickert als globale Variable

var tmp = new Date();
function f() {
  console.log(tmp); // 想打印外层的时间作用域
  if (false) {
    var tmp = 'hello world'; // 这里声明的作用域为整个函数
  }
}
f(); // undefined

var s = 'hello';
for (var i = 0; i < s.length; i++) {
  console.log(s[i]); // i应该为此次for循环使用的变量
}
console.log(i); // 5 全局范围都可以读到

Bereich auf Blockebene

1. Bereich

function f1() {
  let n = 5;
  if (true) {
    let n = 10;
    console.log(n); // 10 内层的n
  }
  console.log(n); // 5 当前层的n
}

1. Bereiche auf Blockebene sind willkürlich verschachtelt

{{{{
  {let insane = 'Hello World'}
  console.log(insane); // 报错 读不到子作用域的变量
}}}};

1. Bereiche auf Blockebene sind wahr. Teilen Sie den Code in Blöcke auf

{
let a = ...;
...
}
{
let a = ...;
...
}

Das obige Formular kann verwendet werden, um einige Ideen zu testen, ohne sich Gedanken über doppelte Variablennamen oder externe Störungen machen zu müssen

Funktionen im Bereich auf Blockebene deklarieren:

Funktionen im Bereich auf Blockebene deklarieren, da der Browser mit altem Code kompatibel sein muss, was einige Probleme verursachen wird!

Funktionen im Bereich auf Blockebene deklarieren, vorzugsweise in Form anonymer Funktionen .

if(true){
  let a = function () {}; // 作用域为块级 令声明的函数作用域范围更清晰
}

Die Scoping-Regeln auf Blockebene von ES6 erlauben, dass Funktionsdeklarationen nur wahr sind, wenn geschweifte Klammern verwendet werden. Wenn keine geschweiften Klammern verwendet werden, wird ein Fehler gemeldet.

// 报错
'use strict';
if (true)
  function f() {} // 我们需要给if加个{}

Es gibt keine variable Förderung

Das Phänomen der variablen Förderung: Im gleichen Umfang Variablen Es kann vor der Deklaration verwendet werden und der Wert ist undefiniert

Wenn ES5 var zum Deklarieren von Variablen verwendet, kommt es häufig zu einer Variablenheraufstufung.

// var 的情况
console.log(foo); // 输出undefined
var foo = 2;

// let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;

Temporäre tote Zone:

Sobald Sie den aktuellen Bereich betreten, ist die Variable, die Sie verwenden möchten, bereits vorhanden, aber nicht vorhanden verfügbar. Nur ​​bis die Codezeile erscheint, die die Variable deklariert, kann die Variable abgerufen und verwendet werden

var tmp = 123; // 声明
if (true) {
  tmp = 'abc'; // 报错 因为本区域有tmp声明变量
  let tmp; // 绑定if这个块级的作用域 不能出现tmp变量
}

Die Bedeutung der temporären toten Zone und der Unfähigkeit, Variablen hochzustufen, ist:

Um Laufzeitfehler zu reduzieren, verhindern Sie die Verwendung dieser Variable vor ihrer Deklaration, da dies zu unerwartetem Verhalten führen kann.

Die wiederholte Deklaration von Variablen ist nicht zulässig.

Diese Situation ist während des Tests aufgetreten: var a= '声明';const a = '不报错', diese Situation liegt daran, dass Babel konvertiert wird Zeit habe ich etwas verarbeitet und es in der Browserkonsole getestet und erfolgreich Fehler gemeldet

let, const Es ist nicht erlaubt, dieselbe Variable wiederholt im selben Bereich zu deklarieren

function func(arg) {
  let arg; // 报错
}

function func(arg) {
  {
    let arg; // 不报错
  }
}

Mit let und const deklarierte globale Variablen werden nicht unter dem Objekt der obersten Ebene aufgehängt

1. Das Objekt der obersten Ebene des Die Browserumgebung ist: window

2. Das oberste Objekt der Knotenumgebung ist: global

3. Globale Variablen, die von var deklariert werden wird unter dem Objekt der obersten Ebene aufgehängt, aber let und const werden nicht unter dem Objekt der obersten Ebene aufgehängt. Zum Beispiel die Kastanie unten

var a = 1;
// 如果在 Node环境，可以写成 global.a
// 或者采用通用方法，写成 this.a
window.a // 1

let b = 1;
window.b // undefined

const command

1. Einmal deklariert , muss sofort Wert zuweisen

   let p; var p1; // 不报错
   const p3 = '马上赋值'
   const p3; // 报错 没有赋值

2. const Nach der Deklaration kann der Wert nicht geändert werden

   Einfacher Typ: kann nicht geändert werden

   const p = '不能改变';
   p = '报错'

   Komplexer Typ: Variablenzeiger kann nicht geändert werden

   Betrachten Sie die folgende Situation:

   const p = ['不能改动']
   const p2 = {
     name: 'OBKoro1'
   }
   p[0] = '不报错'
   p2.name = '不报错'
   p = ['报错']
   p2 = {
     name: '报错'
   }

   const所说的一旦声明值就不能改变，实际上指的是：变量指向的那个内存地址所保存的数据不得改动

• 简单类型(number、string、boolean)：内存地址就是值,即常量(一变就报错).

• 复杂类型(对象、数组等)：地址保存的是一个指针，const只能保证指针是固定的(总是指向同一个地址),它内部的值是可以改变的(不要以为const就安全了！)

  所以只要不重新赋值整个数组/对象， 因为保存的是一个指针，所以对数组使用的push、shift、splice等方法也是允许的，你就是把值一个一个全都删光了都不会报错。

> 复杂类型还有函数，正则等，这点也要注意一下。

总结:

再总结一下，看到这些名词，脑子里应该会有对应的理解，如果没有的话，那可以再看看对应的内容。

var和let/const的区别:

1. 块级作用域

2. 不存在变量提升

3. 暂时性死区

4. 不可重复声明

5. let、const声明的全局变量不会挂在顶层对象下面

const命令两个注意点:

1. let可以先声明稍后再赋值,而const在 声明之后必须马上赋值，否则会报错

2. const 简单类型一旦声明就不能再更改，复杂类型(数组、对象等)指针指向的地址不能更改，内部数据可以更改。

let、const使用场景:

1. let使用场景：变量，用以替代var。

2. const使用场景：常量、声明匿名函数、箭头函数的时候。

以上就是本篇文章的全部内容，希望能对大家的学习有所帮助。更多精彩内容大家可以关注php中文网相关教程栏目！！！

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen var und let/const in Javascript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!