详谈js的变量提升以及使用方法

时间:2021-05-26

介绍

变量提升Hoisting是人们对JavaScript执行上下文工作方式的一种认识,并不是官方给出的改变

从字面上理解,变量提升的意思是变量和函数的声明会在物理层移动到作用域的最前面。但是这样理解并不准确,效果是相同的,但是实际的实现方式是JavaScript的变量和函数的声明会在编译阶段放入内存

这意味着使用者在正式声明一个函数或者变量之前就能够使用它

函数的提升

在JavaScript中,在声明一个函数前,我们就能够使用它,大家应该都体验过,像这样:

test(); function test() { // do something}

在正常的使用情况下,应该需要先声明函数才能调用,但是这种方法仍然能够运行,这是因为JavaScript自动将函数声明事先存入了内存的原因,看起来就像JavaScript自动把函数声明提升到了最前面

变量的提升

对于变量,JavaScript使用类似的方法,但是要注意一点的是,对于变量的提升,JavaScript只会将变量声明提升,但是不会把初始化提升,如果在变量初始化之前使用,则会得到undefined

// undefinedconsole.log(a);// ReferenceError: b is not definedconsole.log(b);var a = 10;// undefinedconsole.log(num);num = 6;// 6console.log(num);num += 7;// 13console.log(num);var num;// undefinedconsole.log(num);num = 1;// 1console.log(num);var num = 2;// 2console.log(num);

这里要注意,JavaScript的变量提升是针对var的,而let和const不存在变量提升这一特性

// ReferenceError: a is not definedconsole.log(a);let a = 10;

一个复杂一点的例子

var a = 100;function fn() { // undefined console.log(a); var a = 200; // 200 console.log(a);}fn();// 100console.log(a);var a;// 100console.log(a);// 300var a = 300;console.log(a);

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章