详谈js的变量提升以及使用方法
介绍
变量提升Hoisting是人们对JavaScript执行上下文工作方式的一种认识,并不是官方给出的改变
从字面上理解,变量提升的意思是变量和函数的声明会在物理层移动到作用域的最前面。但是这样理解并不准确,效果是相同的,但是实际的实现方式是JavaScript的变量和函数的声明会在编译阶段放入内存
这意味着使用者在正式声明一个函数或者变量之前就能够使用它
函数的提升
在JavaScript中,在声明一个函数前,我们就能够使用它,大家应该都体验过,像这样:
test();
function test() {
// do something
}
在正常的使用情况下,应该需要先声明函数才能调用,但是这种方法仍然能够运行,这是因为JavaScript自动将函数声明事先存入了内存的原因,看起来就像JavaScript自动把函数声明提升到了最前面
变量的提升
对于变量,JavaScript使用类似的方法,但是要注意一点的是,对于变量的提升,JavaScript只会将变量声明提升,但是不会把初始化提升,如果在变量初始化之前使用,则会得到undefined
// undefined console.log(a); // ReferenceError: b is not defined console.log(b); var a = 10;
// undefined console.log(num); num = 6; // 6 console.log(num); num += 7; // 13 console.log(num); var num;
// undefined console.log(num); num = 1; // 1 console.log(num); var num = 2; // 2 console.log(num);
这里要注意,JavaScript的变量提升是针对var的,而let和const不存在变量提升这一特性
// ReferenceError: a is not defined console.log(a); let a = 10;
一个复杂一点的例子
var a = 100;
function fn() {
// undefined
console.log(a);
var a = 200;
// 200
console.log(a);
}
fn();
// 100
console.log(a);
var a;
// 100
console.log(a);
// 300
var a = 300;
console.log(a);
相关文章
实例解析JS布尔对象的toString()方法和valueOf()方法
这篇文章主要介绍了JS的布尔对象的toString()方法和valueOf()方法,是JavaScript入门学习中的基础知识,需要的朋友可以参考下2015-10-10
window.location.href的用法(动态输出跳转)
无论在静态页面还是动态输出页面中window.location.href都是不错的用了跳转的实现方案2014-08-08
window.parent与window.openner区别介绍
今天总结一下js中几个对象的区别和用法,对这几个概念混淆的朋友可以看看2012-04-04
详解javascript中var与ES6规范中let、const区别与用法
es6刚流行那会,我只知道var即将退出历史舞台,取而代之的是let和const,却不知道var有什么缺陷,为什么会被取代。今天在网上看到一段视频,解答了我的疑惑2020-01-01
图解prototype、proto和constructor的三角关系
在javascript中,prototype、constructor以及__proto__之间有着“著名”的剪不断理还乱的三角关系,楼主就着自己对它们的浅显认识,来粗略地理理以备忘,有不对之处还望斧正。2016-07-07


最新评论