想要了解var
(ES5)和let
(ES6)区别,首先就要了解ES5下JS的变量提升
当浏览器开辟出供代码执行的栈内存后,代码并没有自上而下立即执行,而是继续做了一些事情:把当前作用域中所有带var/function关键字的进行提前的声明和定义 => 变量提升机制
var a;
,如果只声明没有赋值,默认值是undefined
console.log(a);
var a = 13;
输出:undefined
相当于:
var a; // 只声明没有赋值,默认为undefined
console.log(a);
a = 13;
let
和const
不存在变量提升机制创建变量的六种方式中:var/function
有变量提升,而let/const/class/import
都不存在这个机制
var
允许重复声明,而let
不允许重复声明在相同的作用域(或执行上下文中)
var/function
关键词声明变量并且重复声明,是不会有影响的(声明第一次之后,之后再遇到就不会再重复声明了)let/const
就不行,浏览器会校验当前作用域中是否已经存在这个变量了,如果已经存在了,则再次基于let
等重新声明就会报错在浏览器开辟栈内存供代码自上而下执行之前,不仅有变量提升的操作,还有很多其他的操作 => “词法解析”或者“词法检测”:就是检测当前即将要执行的代码是否会出现“语法错误 SyntaxError”,如果出现错误,代码将不会再执行(第一行都不会执行)
console.log(1) // => 这行代码就已经不会执行了
let a = 12
console.log(a)
let a = 13 // => 此行出错:SyntaxError: Identifier 'a' has already been declared
console.log(a)
所谓重复就是:不管之前通过什么方法,只要当前栈内存中存在了这个变量,我们使用let/const
等重复再声明这个变量就是语法错误。eg:
console.log(a)
var a = 12
let a = 13 // => SyntaxError: Identifier 'a' has already been declared
console.log(a)
console.log(a)
let a = 13
var a = 12 // => SyntaxError: Identifier 'a' has already been declared
console.log(a)
console.log(a)
// => ReferenceError: a is not defined
typeof a
未报错
console.log(typeof a)
// => 'undefined' 这是浏览器的bug,本应报错,因为没有a(暂时性死区)
使用let
后:
console.log(typeof a)
// => ReferenceError: Cannot access 'a' before initialization
let a
返回不能在a
被定义之前使用它,解决暂时性死区问题。
首先看带var与不带var创建全局变量时的区别
/*
* 不带var的:相当于给全局对象window设置了一个属性a
* window.a = 13
*/
a = 13
console.log(a) // => window.a 13
/*
* 栈内存变量存储空间
* b
* 带var的:是在全局作用域下声明了一个变量b(全局变量),
* 但是在全局下声明的变量也相当于给全局对象window增加了一个对应的
* 属性b(只有全局作用域具备这个特点)
*/
var b = 14
console.log(b)
console.log(window.b)
使用let创建时:
/*
* 栈内存变量存储空间
* c
* 带let的:仅仅在全局作用域下声明了一个变量b(全局变量),
* 并未给全局对象window增加对应的属性c
*/
let c = 15
console.log(c) // => 15
console.log(window.c) // => undefined
经典例题指路:面试题总结2-大厂
之“下面代码能否实现点击某个按钮,body的背景色改为按钮对应的颜色,若不能,如何改进(腾讯)”
本文地址:https://blog.csdn.net/a1056244734/article/details/107150875
如对本文有疑问, 点击进行留言回复!!
[Node.js] mySQL数据库 -- 英雄英雄管理系统接口
javascript 实现Promise.prototype.then
网友评论