轻松理解javascript中的局部变量与全局变量以及this的问题

javascript有两种变量：局部变量和全局变量。当然，我们这篇文章是帮助大家真正的区别这两种变量。

首先，局部变量是指只能在本变量声明的函数内部调用。全局变量时整个代码中都可以调用的变量。当然，单单从字面上理解肯定是不清楚的，下面我详细的介绍下：
 大家都知道，变量是需要用var关键字声明的。但是javascript中也可以隐式的使用变量，就是不用声明，直接使用。而且，千万注意，javascript把隐式声明的变量总是当成全局变量来使用的。
 例如：
复制代码 代码如下:
 function myName() {
  i = 'yuanjianhang';
 }
 myName();
 function sayName() {
  alert(i);
 }
 sayName();
 
输出结果为：yuanjianhang
 
这说明变量i就是一个全局的变量，如果把上面的代码改成如下：
 
复制代码 代码如下:

 function myName() {
  var i='yuanjianhang';
 }
 myName();
 function sayName() {
  alert(i);
 }
 sayName();


此时，游览器将没有任何输出结果，因为i 是在函数myName中定义的，所以它只是myName的局部变量，不可能被外部调用。
  
 现在再回过头来看下面的代码：
 
复制代码 代码如下:

 function myName() {
  i = 'yuanjianhang';
 }
 myName();
 function sayName() {
  alert(i);
 }
 sayName();
 
现在，我们进行一下改动，把myName();去掉，代码如下：
 
复制代码 代码如下:

 function myName() {
  i = 'yuanjianhang';
 }
 function sayName() {
  alert(i);
 }
 sayName();
 
 此时，游览器也不会有如何反应。因为虽然i是全局变量，但是函数myName()并没有被调用，所以就相当于虽然声明了i，但是并没有给i赋予任何的值，所以没有任何输出。
 同理，如果把上例改成：

复制代码 代码如下:

 function myName() {
  
  i = 'yuanjianhang';
 }
 function sayName() {
  alert(i);
 }
 sayName();
 myName();


这种情况下还是不会输出任何结果，javascript代码的执行时从上到下的，在sayName()函数被调用时会检查变量i的值，此时函数myName尚未执行，也就是说i还没有被赋值，所以不会输出任何结果。
  
 为了方便大家更好的理解，这里再举一个例子：
 
复制代码 代码如下:

 var i = 'yuanjianhang';
 function myloveName() {
  i = 'guanxi';
 }
 myloveName();
 function myName() {
  alert(i);
 }
 myName();

这次的结果是什么呢？
 答案是guanxi
 首先，i的原始值是yuanjianhang，但是当调用myloveName()函数之后，将i的值改为guanxi，所以最后的输出结果是guanxi。
 
如果将代码改为：
 
复制代码 代码如下:

 var i = 'yuanjianhang';
 function myloveName() {
  var i = 'guanxi';
 }
 myloveName();
 function myName() {
  alert(i);
 }
 myName();

此时的结果就是yuanjianhang了，因为代码中的两个i不一样，一个是全局的，一个是局部的，也可以这样理解，虽然两个i的名字一样，但是这两个i的本质却不一样，好像有两个名字一样的人一样，虽然名字一样，但却不是同一个人。
 
如果将代码改造成这样：

复制代码 代码如下:

 var i = 'yuanjianhang';
 function myloveName() {
  i = 'guanxi';
 }
 function myName() {
  alert(i);
 }
 myName();
 myloveName();
 
相信大家可以自己算出结果了，结果是yuanjianhang。
 
既然函数内部可以调用全局变量，那么下面这种情况呢：

复制代码 代码如下:

 var i = 'yuanjianhang';
 function myloveName() {
   i = 'guanxi';
  alert(i);
 }
 myloveName();
 
此时变量的值是哪个呢？
 
我们来分析下：
 
首先全局变量i被赋值为：yuanjianhang。
 
接下来myloveName()函数被调用，全局变量i被重新赋予新的值：guanxi
 
所以结果肯定是:guanxi。
 
如果我们把alert提前呢，像这样：
 
复制代码 代码如下:

 var i = 'yuanjianhang';
 function myloveName() {
   alert(i);
  i = 'guanxi';
 }
 myloveName();

这时候结果是什么呢？
 经过验证结果是：undefined
 如果代码是这样呢:
 
复制代码 代码如下:

 var i = 'yuanjianhang';
 function myloveName() {
   alert(i);
 }
 myloveName();
 
此时i的结果是：yuanjianhang
 
为什么会发生上面undefined情况，因为代码的执行顺序是从上到下的，在输出i之前并没有对i定义。所以从这里可以看出，使用代码的时候，变量的声明一定要放到代码的前面，以避免出现类似的问题！
 
同理：

复制代码 代码如下:
 var i = 'yuanjianhang';
 function myloveName() {
  alert(i);
  var i = 'guanxi';
  
 }
 myloveName();
 
这种情况下也会输出：undefined
 

好了，关于变量我只有这么多的介绍了，相信这些任何人都可以看明白。不管代码如何复制，其核心是不会变的。

this多用于函数内部，它永远指向调用他的那个对象，看看下面的例子就明白了 


var test={ 
   a:"test", 
   msg:function(){ 
     a="1234"; 
     alert(this.a); 
     var msg1= function(){ 
alert(this.a); 
     } 
     msg1(); 
   } 
} 
test.msg(); 这样会分别显示 "test" ,"1234". 


但this也不是这么简单，在看看下面的例子 
function test1()   
{   
  this.var01 = "test"; 
} 


function test2()   
{ 
  alert(var01); 
} 


var a= new test1(); 
test1(); 
test2(); 
alert(a.var01); 
都可以得到"test". 
可以发现var01变量既是一个全局变量，又是test1内的成员变量。也就是说，如果在函数内部用this定义的变量，如果这个函数你不是直接来运行，而是作为一个类来new的话，虽然函数也要执行一遍，但里面的this定义的 变量是作为类的成员变量来定义的，也就是一个局部变量，上面的测试代码，如果去掉test1();  test2()运行就是未定义变量错误了。