美文网首页
JavaScript中的变量提升

JavaScript中的变量提升

作者: FYW燕尾蝶 | 来源:发表于2016-08-03 20:57 被阅读0次

请看一段下面的代码:
var v='Hello World';
(function(){
alert(v);
var v='I love you';
})()
如果这个是一个面试题,面试官问你这个结果是多少?你怎么回答?
我们先看结果吧!
结果是 undefined?和你上面自己想的一样吗?
好吧,我就不故弄玄虚了。其实,这里面隐藏了一个陷阱-----JavaScript中的变量提升(Hoisting);
提升,顾名思义,就是把下面的东西提到上面。在JS中,就是把定义在后面的东东(变量或函数)提升到前面中定义。
在解释提升之前,我们先来看一下js中的作用域(scoping)问题。
请看一段下面的代码:
var x = 1;
console.log(x); // 1
if (true) {
var x = 2;
console.log(x); //2
}
console.log(x);// 2
这是因为JavaScript是函数级作用域(function-level scope)。
块,就像if语句,并不会创建一个新的作用域。只有函数才会创建新的作用域。
对于这个问题有一个解决方案。如果你必须在函数中创建一个临时的作用域,请像下面这样做:
function foo() {
var x = 1;
if (x) {
(function () {
var x = 2;
// some other code
})();
}
// x is still 1.
}
变量提升,就是把变量提升提到函数top的地方。变量提升,只是提升变量的声明,并不会把赋值也提升上来。
比如:
(function(){
var a='One';
var b='Two';
var c='Three';
})()
实际上它是这样子的:
(function(){
var a,b,c;
a='One';
b='Two';
c='Three';
})()
这个时候就把变量提升了呀。
好,我们现在回到第一段code里面。为什么会报错呢?其实,上面代码真正变成如下:
var v='Hello World';
(function(){
var v;
alert(v);
v='I love you';
})()
所以,才会提示说“undefined”。
So,我们在写js code 的时候,需要把变量放在块级作用域的顶端,比如上面所举的例子:var a,b,c ; 防止出现意外。
函数提升
函数提升是把整个函数都提到前面去。
在写js code 的时候,有2种写法,一种是函数表达式,另外一种是函数声明方式。需要重点注意的是,只有函数声明形式才能被提升。
函数声明方式提升【成功】
function myTest(){
foo();
function foo(){
alert("我来自 foo");
}
}
myTest();
函数表达式方式提升【失败】
function myTest(){
foo();
var foo =function foo(){
alert("我来自 foo");
}
}
myTest();

相关文章

  • 变量提升 & this指向

    变量提升 JavaScript 中,函数及变量的声明都将被提升到函数的最顶部。JavaScript 中,变量可以在...

  • var与let、const的区别

    什么是变量提升?JavaScript 中,函数及变量的声明都将被提升到函数的最顶部。JavaScript 中,变量...

  • JavaScript 变量提升

    JavaScript 中,函数及变量的声明都将被提升到函数的最顶部。JavaScript 中,变量可以在使用后声明...

  • JavaScript 变量提升

    JavaScript 中,函数及变量的声明都将被提升到函数的最顶部。JavaScript 中,变量可以在使用后声明...

  • javascript中的变量提升

    javascript(以下称js)中的变量提升是我们经常会遇到的问题。 变量提升,顾名思义就是将后面的变量提升至作...

  • JavaScript中的变量提升

    请看一段下面的代码:var v='Hello World';(function(){alert(v);var v=...

  • 作用域

    变量声明提升 在 JavaScript 中,函数声明(function aa(){})与变量声明(var)经常被 ...

  • 【JavaScript】变量提升以及var对变量提升的影响

    JavaScript中变量的提升,往往会影响到我们对变量的正常获取,所以特写此文,以便以后翻阅。 什么是变量提升 ...

  • JS面试知识点 变量提升

    变量提升,也可以说成是变量声明提升,是指在Javascript中变量的声明会被提到作用域的顶部,而变量的赋值留在原...

  • JavaScript中的变量提升/函数提升

    变量提升 在ES6之前,JavaScript没有块级作用域的说法(一对花括号{}为一个块级作用域),只有全局作用域...

网友评论

      本文标题:JavaScript中的变量提升

      本文链接:https://www.haomeiwen.com/subject/jjxcsttx.html