源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

JS 作用域与作用域链详解

  • 时间:2020-09-20 01:23 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:JS 作用域与作用域链详解
[b](1)作用域[/b] 一个变量的作用域(scope)是程序源代码中定义的这个变量的区域。 1. 在JS中使用的是词法作用域(lexical scope) 不在任何函数内声明的变量(函数内省略var的也算全局)称作全局变量(global scope) 在函数内声明的变量具有函数作用域(function scope),属于局部变量 局部变量优先级高于全局变量
[url=http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]"> <html xmlns="[url=http://www.w3.org/1999/xhtml]http://www.w3.org/1999/xhtml[/url]"> <head> <script type="text/javascript"> function buttonInit(){     for(var i=1;i<4;i++){         var b=document.getElementById("button"+i);         b.addEventListener("click",function(){             alert("Button"+i); //都是 Button4         },false);     } } window.onload=buttonInit; </script> </head> <body> <button id="button1">Button1</button> <button id="button2">Button2</button> <button id="button3">Button3</button> </body> </html>
为什么? 根据作用域链中变量的寻找规则:
[url=http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]"> <html xmlns="[url=http://www.w3.org/1999/xhtml]http://www.w3.org/1999/xhtml[/url]"> <head> <script type="text/javascript"> function buttonInit(){     for(var i=1;i<4;i++){         (function(data_i){         var b=document.getElementById("button"+data_i);         b.addEventListener("click",function(){             alert("Button"+data_i);         },false);         })(i);     } } window.onload=buttonInit; </script> </head> <body> <button id="button1">Button1</button> <button id="button2">Button2</button> <button id="button3">Button3</button> </body> </html>
这样就可以 Button1..2..3了 4.上述就是作用域链的基本描述,另外,with语句可用于临时拓展作用域链(不推荐使用with) 语法形如: with(object) statement 这个with语句,将object添加到作用域链的头部,然后执行statement,最后把作用域链恢复到原始状态 简单用法: 比如给表单中各个项的值value赋值 一般可以我们直接这样
[u]复制代码[/u] 代码如下:
var f = document.forms[0]; f.name.value = ""; f.age.value = ""; f.email.value = "";
引入with后(因为使用with会产生一系列问题,所以还是使用上面那张形式吧)
[u]复制代码[/u] 代码如下:
with(document.forms[0]){ f.name.value = ""; f.age.value = ""; f.email.value = ""; }
另外,假如 一个对象o具有x属性,o.x = 1; 那么使用
[u]复制代码[/u] 代码如下:
with(o){   x = 2; }
就可以转换成 o.x = 2; 假如o没有定义属性x,它的功能就只是相当于  x = 2; 一个全局变量罢了。 因为with提供了一种读取o的属性的快捷方式,但他并不能创建o本身没有的属性。 以上所述就是本文的全部内容了,希望能够对大家学习javascript有所帮助。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部