JS高级心法——作用域链

本文主要是介绍JS高级心法——作用域链，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

首先我们来看两个js中的代码：   

<script  type="text/javascript">  var c=5;function t1(){	var	d=6function t2(){var e=7		 alert(c+d+e);		}t2();}t1(); 
</script>

  这个你很快会得出结论：18；

<script language="javascript" type="text/javascript">function t1(){	var d;function t2(){d=5;e=6;}t2();}t1();alert(e);  alert(window.d);
</script>

     

   思考下？……

你的答案是 6，undefined吗？如果不是请继续往下看吧，这其实就是作用域链的问题。

   我们知道js中用var声明一个变量 ,寻找变量首先在函数内寻找，找不到则再往外层寻找直到全局（window）区域。这就是第一个程序的依据
   window.xxx引用全局变量，找不到作为某个属性不存在，则返回undefined。

   好了再看一个：

<script  type="text/javascript">   var str1='global';function t1(){	alert(str1);alert(str2);var str2='local';	  }t1();	
</script>

    这个如果你在网上查好多关于作用域的都有这个例子来解释，但是看了他们洋洋洒洒写了好多结果自己越看越迷糊。

    历经千辛万苦终于得出了很实用的方法，免得看太多让人头晕的东西。

其实js代码在整体运行时分为：词法分析期和运行期。   

    词法分析分析3样东西：第一步：先分析参数
                        第二步:再分析变量声明
                        第三步:分析函数声明
   具体： 0：函数运行前瞬间生成活动对象Actve Object（AO）
          1：
             1.1函数声明的参数形成AO的属性值全是undefined
             1.2接收实参，形成AO相应的属性的值
          2：分析变量声明！
             如果AO上还没有属性，则添加AO属性，值是undefined
             如果已经有属性，则不做任何影响
          3.分析函数声明，如果函数属性已经存在，则被覆盖。

   依据整理分析下下面：

<script  type="text/javascript">   function t2(age){var age=99;alert(age); }t2(5);//运行结果是99
</script>

分析过程：

0:形成AO={}

1.分析形参age为undefined

2.分析var age 发现AO已经有age属性，不做任何影响

执行过程：AO.age=99;

alert(age)结果为99

明白了作用域链分析出结果我们才能更好的明白视频中讲解的例子，以后再也不用担心自己找不到“北”了！

这篇关于JS高级心法——作用域链的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---