JS高级心法——作用域链
2014-11-02 22:03
211 查看
首先我们来看两个js中的代码:
这个你很快会得出结论:18;
思考下?……
你的答案是 6,undefined吗?如果不是请继续往下看吧,这其实就是作用域链的问题。
我们知道js中用var声明一个变量 ,寻找变量首先在函数内寻找,找不到则再往外层寻找直到全局(window)区域。这就是第一个程序的依据
window.xxx引用全局变量,找不到作为某个属性不存在,则返回undefined。
好了再看一个:
这个如果你在网上查好多关于作用域的都有这个例子来解释,但是看了他们洋洋洒洒写了好多结果自己越看越迷糊。
历经千辛万苦终于得出了很实用的方法,免得看太多让人头晕的东西。
其实js代码在整体运行时分为:词法分析期和运行期。
词法分析分析3样东西:第一步:先分析参数
第二步:再分析变量声明
第三步:分析函数声明
具体: 0:函数运行前瞬间生成活动对象Actve Object(AO)
1:
1.1函数声明的参数形成AO的属性值全是undefined
1.2接收实参,形成AO相应的属性的值
2:分析变量声明!
如果AO上还没有属性,则添加AO属性,值是undefined
如果已经有属性,则不做任何影响
3.分析函数声明,如果函数属性已经存在,则被覆盖。
依据整理分析下下面:
0:形成AO={}
1.分析形参age为undefined
2.分析var age 发现AO已经有age属性,不做任何影响
执行过程:AO.age=99;
alert(age)结果为99
明白了作用域链分析出结果我们才能更好的明白视频中讲解的例子,以后再也不用担心自己找不到“北”了!
<script type="text/javascript"> var c=5; function t1(){ var d=6 function 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高级心法——作用域链
- js高级知识---作用域链
- JS高级程序设计第四章笔记作用域&作用域链
- 第十八篇 js高级知识---作用域链
- js高级——作用域链
- 第18篇 js高级知识---作用域链
- JS高级知识(作用域,作用域链,闭包)
- JS 的一些高级方法或属性
- js中replace方法的高级替换
- WebBrowser 高级扩展 js扩展 js订阅C#事件
- JS字符串高级应用
- 转别人的js(二)高级运用--a
- 超级实用且不花哨的js代码大全 (二) -----高级应用(一)
- js 面向对象的技术创建高级 Web 应用程序
- js高级程序设计
- 高级:运用Jakarta Struts的七大实战心法
- JS数组高级应用
- 超级实用且不花哨的js代码大全 (三) -----高级应用(二)
- 超级实用且不花哨的js代码大全 (三) -----高级应用(二)
- JS高级应用:操作模态与非模态对话框