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


Posted in Javascript onMay 12, 2014
<!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中解析四则运算表达式的算法和示例
Aug 11 Javascript
js单独获取一个checkbox看其是否被选中
Sep 22 Javascript
jQuery ready()和onload的加载耗时分析
Sep 08 Javascript
jQuery实现base64前台加密解密功能详解
Aug 29 jQuery
Vue中computed与methods的区别详解
Mar 24 Javascript
node.js express框架简介与实现
Jul 23 Javascript
js对象数组和对象的使用实例详解
Aug 27 Javascript
Vue实现base64编码图片间的切换功能
Dec 04 Javascript
JS实现放烟花效果
Mar 10 Javascript
详解vue-template-admin三级路由无法缓存的解决方案
Mar 10 Javascript
es6中new.target的作用和使用场景简单示例分析
Mar 14 Javascript
理解Proxy及使用Proxy实现vue数据双向绑定操作
Jul 18 Javascript
Javascript中的回调函数和匿名函数的回调示例介绍
May 12 #Javascript
JavaScript中对象属性的添加和删除示例
May 12 #Javascript
构造函数+原型模式构造js自定义对象(最通用)
May 12 #Javascript
Javascript中对象继承的实现小例
May 12 #Javascript
JavaScript中的函数的两种定义方式和函数变量赋值
May 12 #Javascript
js图片处理示例代码
May 12 #Javascript
jquery实现的一个简单进度条效果实例
May 12 #Javascript
You might like
php in_array 函数使用说明与in_array需要注意的地方说明
2010/04/13 PHP
关于UEditor编辑器远程图片上传失败的解决办法
2012/08/31 PHP
说说PHP的autoLoad自动加载机制
2012/09/27 PHP
PHP基础之运算符的使用方法
2013/04/28 PHP
PHP获取表单所有复选框的值的方法
2014/08/28 PHP
CI框架(ajax分页,全选,反选,不选,批量删除)完整代码详解
2016/11/01 PHP
thinkPHP5.1框架路由::get、post请求简单用法示例
2019/05/06 PHP
上传文件返回的json数据会被提示下载问题解决方案
2014/12/03 Javascript
招聘网站基于jQuery实现自动刷新简历
2015/05/10 Javascript
JavaScript中数组的合并以及排序实现示例
2015/10/24 Javascript
ECMA5数组的新增方法有哪些及forEach()模仿实现
2015/11/03 Javascript
javascript实现自动填写表单实例简析
2015/12/02 Javascript
jQuery+CSS实现滑动的标签分栏切换效果
2015/12/17 Javascript
React Native 集成jpush-react-native的示例代码
2017/08/16 Javascript
vue在手机中通过本机IP地址访问webApp的方法
2018/08/15 Javascript
详解如何在vscode里面调试js和node.js的方法步骤
2018/12/24 Javascript
前端js中的事件循环eventloop机制详解
2019/05/15 Javascript
jquery轻量级数字动画插件countUp.js使用详解
2019/10/17 jQuery
小程序双头slider选择器的实现示例
2020/03/31 Javascript
[01:15:16]DOTA2-DPC中国联赛 正赛 Elephant vs Aster BO3 第一场 1月26日
2021/03/11 DOTA
Python 列表(List)操作方法详解
2014/03/11 Python
Python下的常用下载安装工具pip的安装方法
2015/11/13 Python
python3 pandas 读取MySQL数据和插入的实例
2018/04/20 Python
python如何创建TCP服务端和客户端
2018/08/26 Python
使用python list 查找所有匹配元素的位置实例
2019/06/11 Python
Python实现K折交叉验证法的方法步骤
2019/07/11 Python
使用python执行shell脚本 并动态传参 及subprocess的使用详解
2020/03/06 Python
python实现图像全景拼接
2020/03/27 Python
使用Python实现批量ping操作方法
2020/05/06 Python
解决导入django_filters不成功问题No module named 'django_filter'
2020/07/15 Python
Python爬虫设置Cookie解决网站拦截并爬取蚂蚁短租的问题
2021/02/22 Python
全面总结使用CSS实现水平垂直居中效果的方法
2016/03/10 HTML / CSS
HTML5中form如何关闭自动完成功能的方法
2018/07/02 HTML / CSS
秋季运动会通讯稿
2014/01/24 职场文书
2015年大学生社会实践评语
2015/03/26 职场文书
入伍通知书
2015/04/23 职场文书