首页 > 代码库 > javascript变量声明和作用域提升
javascript变量声明和作用域提升
以前的知识总是忘，遇到代码又看不懂。要再复习一下，顺便记录一下。
1 add(1,2);2 function add(a,b){3 alert(a+b);4 }
代码能输出3，为什么不是按顺序执行？应该是 //add is not defined ...
javascript的变量声明具有hoisting机制，JavaScript引擎在执行的时候，会把所有变量的声明都提升到当前作用域的最前面。
也就是说，function add(a,b){alert(a+b)}是一个函数声明,告诉我们有这样一个函数，于是就被提升到作用域最前面了。同样，声明了别的变量也被提升.
上面例子就等于：
1 function add(a,b){2 alert(a+b);3 }4 add(1,2);
注意：只是声明被提升，变量赋值或函数的表达式并没有被提升。
1 alert(a); // undefined2 alert(b); // undefined3 alert(c); // undefined4 5 var a=0,b=1,c=2;
它相当于：
1 var a,b,c2 alert(a);3 alert(b);4 alert(c);5 a=0;6 b=1;7 c=2;
函数也一样：仅仅是var=add被提升，后面的表达式还在原地。
1 (function(){2 add(1,2); //add is not a function3 var add = function(a,b){4 alert(a+b)5 }6 })()
注意：即使给表达式也命名，那也不会被提升
1 (function(){2 add(1,2); //add is not a function3 var add = function add(a,b){4 alert(a+b)5 }6 })()
作用域：
1 var scope="global"; 2 function t(){ 3 console.log(scope); //ubdefined4 var scope="local" 5 console.log(scope); //local6 } 7 t();
var scope="global"; 是全局作用域，在函数里面，又定义了一个局部变量，变量提升。赋值未提升，所以是undefined，后面赋值了就是local
在C++等语言中，凡是有{}括起来的，都有块级作用域，但js没有，有函数作用域
当要调用一个对象时，它会从局部到全局，一个一个找，找到了就不继续找。
1 var name="global"; 2 if(true){ 3 var name="local"; 4 console.log(name) //local5 } 6 console.log(name); //local
if不是函数，没有块级作用域，它的上下文就是全局的。
相当于：
1 var name="global"; 2 var name="local"; 3 if(true){ 4 console.log(name) 5 } 6 console.log(name);
再看这个，从局部到全局，一个一个找，找到了就不继续找。
1 name="lwy"; 2 function t(){ 3 var name="tlwy"; 4 function s(){ 5 var name="slwy"; 6 console.log(name); 7 } 8 function ss(){ 9 console.log(name); 10 } 11 s(); //slwy12 ss(); //tlwy13 } 14 t();
s()先在局部找，找到了var name=‘slwy‘就输出了。
ss()在自己内部没有，就往上找，在t()函数内找，找到了var name=‘tlwy‘，也就输出了。
若没找到，就会继续在全局中找。这样就形成了一个作用域链，在最内部就是链头，没找到就沿着链找，链尾就是全局作用域了。
一个常见的问题，按钮，每次都是弹出最后一个：
1 var aLi = document.getElementsByTagName(‘li‘);2 for(var i = 0; i < aLi.length; i++){3 aLi[i].onclick = function(){4 alert(i); // 每次都弹出最后一个的值5 }6 }
在页面加载完时，这个js函数就运行了，当我们点击时，它会去找i的值，最内部的匿名函数没有，就往上走，在外层找到了i，是4，就输出了4.
解决这方法：
1 for (var i = 0; i < aLi.length; i++) {2 aLi[i].onclick = function (msg) {3 show:function(){4 alert(msg)5 }6 Return show;7 })(i)8 }
1 for (var i = 0; i < aLi.length; i++) {2 (function(i){3 aLi[i].onclick = function () {4 alert(i);5 };6 })(i)7 }
都是将他们保存起来
文章用于学习记录，若有错误，望指正。
javascript变量声明和作用域提升