本篇文章给大家带来的内容是关于es6中var、let、const、块级作用域以及暂存死区的介绍，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。
var
语法
var varname1 [= value1 [, varname2 [, varname3 ... [, varnameN]]]];
登录后复制
使用
var a, b=2 // 声明多个变量，可以赋值，也可以不赋值a=1 // 先声明，再赋值
登录后复制
var变量提升
使用var声明的变量将会被提升到函数的顶部
console.log(a) // undefinedvar a =2 console.log(a) // 2console.log(b) //Uncaught ReferenceError: b is not defined...
登录后复制
以上代码相当于
var aconsole.log(a) // undefineda=2console.log(a) // 2console.log(b) //Uncaught ReferenceError: b is not defined...
登录后复制
0x002 let
语法
let var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]];
登录后复制
使用
let a, b = 2 // 声明多个变量，赋值不赋值无所谓a = 2 // 声明之后再赋值
登录后复制
不再提升
console.log(a) // Uncaught ReferenceError: a is not defined...let a=1
登录后复制
注意：猜测， 使用babel翻译一下代码发现，只是let变成了var，所以使用babel转义之后的代码依旧会提升
不能重复声明
let a=1let a=2 // Uncaught SyntaxError: Identifier 'a' has already been declared
登录后复制
const
语言
const name1 = value1 [, name2 = value2 [, ... [, nameN = valueN]]];
登录后复制
使用
const a=1, b=2 // 不能省略的值
登录后复制
不能省略的值
const c // Uncaught SyntaxError: Missing initializer in const declaration
登录后复制
不能重复赋值
const d=4d=5 // Uncaught TypeError: Assignment to constant variable.
登录后复制
可以修改的引用
const e=[]e[0]=0console.log(e) //[0]
登录后复制
块级作用域
块级作用域是随着let、const而来最有用的特性了，在之前的js中，js的作用域是函数级的，由此带来的几个臭名昭著的问题：
意外被修改的值
function varTest() { var x = 1; if (true) { var x = 2; // 同样的变量! console.log(x); // 2 } console.log(x); // 2}
登录后复制
可以使用let避免了
function letTest() { let x = 1; if (true) { let x = 2; // 不同的变量 console.log(x); // 2 } console.log(x); // 1}
登录后复制
万恶的for循环和点击事件
var list = document.getElementById("list");for (var i = 0; i < 5; i++) { var item = document.createElement("LI"); item.appendChild(document.createTextNode("Item " + i)); item.onclick = function (ev) { console.log("Item " +i + " is clicked."); }; list.appendChild(item);}console.log(i) // 5
登录后复制
如果点击上面，不管点击哪个，显示出来的都是Item 5 is clicked.，虽然可以使用闭包解决，但是现在有了更好的方案
let list = document.getElementById("list");for (let i = 0; i < 5; i++) { let item = document.createElement("LI"); item.appendChild(document.createTextNode("Item " + i)); item.onclick = function (ev) { console.log("Item " +i + " is clicked."); }; list.appendChild(item);}
登录后复制
作用域规则很简单
{}块内形成一个作用域，包括if、else、while、class、do…while、{}、function
{ const f=6}console.log(f) // Uncaught ReferenceError: f is not defined
登录后复制
for循环中用let声明一个初始因子，该因子在每个循环内都是一个新的作用域
for (let i = 0; i < 10; i++) { console.log(i);}console.log(i) // Uncaught ReferenceError: i is not defined
登录后复制
switch只有一个作用域
switch (x) { case 0: let foo; break; case 1: let foo; break;}// Uncaught SyntaxError: Identifier 'foo' has already been declared
登录后复制
暂存死区-Temporal Dead Zone-TDZ
随着let和const的引入，也引入了暂存死区的概念。使用var的时候，作用域内（函数作用域），在还没使用var声明一个变量的时候，访问该变量，将会获得undefined。但是如果使用let，作用域（块级作用域）内，在还没使用let声明一个变量的时候，访问该变量，将会获得ReferenceError，从作用域开始到let语句之间，就是暂存死区。
{ console.log(a) // Uncaught ReferenceError: a is not defined console.log(b) // Uncaught ReferenceError: b is not defined console.log(c) // undefined // 暂存死区 let a =1 const b=2 var c=3}
登录后复制
注意：猜测， 使用babel翻译一下代码发现，只是let变成了var，所以使用babel转义之后可能不存在暂存死区
以上就是ES6中var、let、const、块级作用域以及暂存死区的介绍的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2737001.html
