JS中的变量提升

来源:互联网 发布:计算机网络就业 知乎 编辑:程序博客网 时间:2024/05/27 14:15

最近在看es6时,发现个问题。提到了变量提升,不是很了解。记录一下相关的知识

var tmp = new Date();function f() {  console.log(tmp);  if (false) {    var tmp = 'hello world';  }}f(); // undefined

上面代码的原意是,if代码块的外部使用外层的tmp变量,内部使用内层的tmp变量。但是,函数f执行后,输出结果为undefined,原因在于变量提升,导致内层的tmp变量覆盖了外层的tmp变量。

那变量提升具体是什么呢?

很简单,就是把变量提升提到函数top的地方。需要说明的是,变量提升 只是提升变量的声明,并不会把赋值也提升上来。

(function() {var a;console.log(a);//undefineda = 1;console.log(a);//1})() 

所以实际上,第一段代码应该这样来看

var tmp = new Date();function f() {  var tmp;  console.log(tmp);  if (false) {    var tmp = 'hello world';  }}f(); // undefined

内层变量覆盖了外层变量。

还有就是函数提升,把整个函数都提到前面去。
函数有两种写法,一种是函数表达式,另外一种是函数声明方式。我们需要重点注意的是,只有函数声明形式才能被提升。

function test(){foo();function foo(){alert("成功");}}test(); //成功
function test(){foo();var foo =function foo(){alert("成功");}}test(); //TypeError:foo is not a function

最近去新浪面试,给了我一个问题

var name="zhangsan";function GetName(){  name = "lisi";  var arr = [1,2,3];  var name ="wangwu" + arr;  console.log(name);}GetName();console.log(name);

相信各位对第一个输出能够很快判断出来,是wangwu1,2,3。问题就是第二个了,也确实是我学艺不精,对于第二个输出不是很确定,后来又仔细看了var变量声明,在函数内有var声明name了,此时函数内部的name其实是局部变量,与外部的name没有关系,而”lisi”作为它的变量赋值也就不会对外部造成影响了,故输出zhangsan。

var name = "zhangsan";function getName(){name = "lisi";}console.log(name);//zhangsangetName();console.log(name);//lisi

感觉在什么地方看过一样的问题,只是当时看的时候觉得理所当然,到真实遇到的时候,可能又是另一种想法了。记录在此,时刻铭记

1 0
原创粉丝点击