JavaSript中变量的作用域闭包的深入理解

 更新时间:2014年05月12日 10:36:02   作者:  
js中的变量都是公用的没有静态变量,下面为大家介绍下变量的作用域闭包,需要的朋友可以参考下
复制代码 代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
/*
* 1.js中的变量都是公用的.
2.js中没有静态变量
3.闭包:函数内部可以调用函数外部的变量;反之,则不行
*/

var r=10;
function test1(){
var r2="abc";
//alert(r)
}
//alert(r2);//不能访问的函数内部的r2
test1();
//嵌套的函数中也ok啦
function test2(num1){
function test3(num2,num3){
return num2+num3+num1;
}
return test3(10,20)
}
//alert(test2(30));
//---------循环中的闭包------------------------
function testfun(){
var r=1;
var arr=[];
for(var x=0;x<3;x++){
r++;
arr[x]=function(){
return r;
}
}
return arr;
}
alert("testfun:"+testfun());
var arr2=testfun();
alert("arr:"+arr2[0]);
alert("arr:"+arr2[1]());
alert("arr:"+arr2[2]());
//==========以上三个弹出框的结果都是4==========
/*分析原因:
理解一下在JavaScript中函数是什么?
函数就是一段可执行的代码块,函数也是可以用一个变量表示,比如函数的第二种定义方式
var add=new Function("a","return a+10");底层的本质就是这个函数名指向
了这一段为变量而创建的可执行的代码。
* 首先当testfun函数执行完毕以后,arr[0],arr[1],arr[]中都是存储了相同的
可执行代码块function(){
return r
}也就是说上面三个是函数变量而已,要执行它们只需要在变量名称后面加()就ok了
而且这个时候r的值4
当执行arr[0]()相当于执行了这个代码块中的代码。
所以最终的结果return r,当然返回4了。
*/

</script>
</head>
<body>

</body>
</html>

相关文章

  • 开发跨浏览器的JavaScript方法说明

    开发跨浏览器的JavaScript方法说明

    IE是当前浏览器的一个异类,不过解决方法倒也相当简单,使用Firefox和Safari 之 类的浏览时,可以使用元素的setArribute方法来设置元素的class属性
    2008-08-08
  • js如何在字符串中查找某个字符的位置

    js如何在字符串中查找某个字符的位置

    这篇文章主要给大家介绍了关于js如何在字符串中查找某个字符的位置的相关资料,在JavaScript中我们经常需要对字符串进行各种操作,包括查找包含特定字符的字符串,需要的朋友可以参考下
    2023-11-11
  • 如何利用微信小程序获取OneNet平台数据显示温湿度

    如何利用微信小程序获取OneNet平台数据显示温湿度

    最近在工作中遇到了一个需求,需要显示温湿度,网上找了一圈没找到解决方法,所以只能自己写一个,这篇文章主要给大家介绍了关于如何利用微信小程序获取OneNet平台数据显示温湿度的相关资料,需要的朋友可以参考下
    2022-03-03
  • 使用JS组件实现带ToolTip验证框的实例代码

    使用JS组件实现带ToolTip验证框的实例代码

    这篇文章主要介绍了使用JS组件实现带ToolTip验证框的实例代码,需要的朋友可以参考下
    2017-08-08
  • js给selected添加options的方法

    js给selected添加options的方法

    这篇文章主要介绍了js给selected添加options的方法,涉及javascript动态添加页面下拉列表selected的技巧,需要的朋友可以参考下
    2015-05-05
  • 浅谈js的html元素的父节点,子节点

    浅谈js的html元素的父节点,子节点

    下面小编就为大家带来一篇浅谈js的html元素的父节点,子节点。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • js实现内容显示并使用json传输数据

    js实现内容显示并使用json传输数据

    这篇文章主要为大家详细介绍了js实现内容显示并使用json传输数据的方法,感兴趣的小伙伴们可以参考一下
    2016-03-03
  • javascript 页面划词搜索JS

    javascript 页面划词搜索JS

    这个脚本是网上的代码修改的,兼容各主流浏览器,优化页面异步加载的文字的检索提示框定位,根据选择文字位置与屏幕尺寸计算检索提示框定位。
    2009-09-09
  • bootstrap-paginator服务器端分页使用方法详解

    bootstrap-paginator服务器端分页使用方法详解

    这篇文章主要为大家详细介绍了bootstrap-paginator服务器端分页的使用方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-02-02
  • Javascript继承机制的设计思想分享

    Javascript继承机制的设计思想分享

    我花了很多时间,学习这个部分,还做了很多笔记。但是都属于强行记忆,无法从根本上理解。
    2011-08-08

最新评论