JavaScript中通过闭包解决只能取得包含函数中任何变量最后一个值的问题


Posted in Javascript onAugust 12, 2010
<script type="text/javascript"> 
function createArray() { 
var arr = new Array(); 
for (var i = 0; i < 10; i++) { 
arr[i] = function () { 
return i; 
} 
} 
return arr; 
} 
var funcs = createArray(); 
for (var i = 0; i < funcs.length; i++) { 
document.write(funcs[i]() + "<br />"); 
} 
//以上输出全部是i的最后一次的值(10),即会输出10个10,显然这不是我们想要的 
//原因:因为每个函数都保存了createArray函数的活动对象,所以他们引用的都是同一个i(按引用传的值) 
//解决方案:把按引用传参修改为按值传参 
function createArray() { 
var arr = new Array(); 
for (var i = 0; i < 10; i++) { 
arr[i] = function (num) { 
return function () { 
return num; 
} 
} (i);//调用此匿名函数返回内部匿名函数,这里多了一步按值传递参数 
} 
return arr; 
} 
var funcs = createArray(); 
for (var i = 0; i < funcs.length; i++) { 
alert(funcs[i]() + "<br />"); 
} 
//以上输出的为理想结果 
</script>
Javascript 相关文章推荐
一个可以显示阴历的JS代码
Mar 05 Javascript
js读取注册表的键值示例
Sep 25 Javascript
js生成随机数的过程解析
Nov 24 Javascript
JS验证邮件地址格式方法小结
Dec 01 Javascript
JavaScript电子时钟倒计时第二款
Jan 10 Javascript
Zabbix添加Node.js监控的方法
Oct 20 Javascript
详解webpack提取第三方库的正确姿势
Dec 22 Javascript
js实现HTML中Select二级联动的实例
Jan 05 Javascript
解决mpvue + vuex 开发微信小程序vuex辅助函数mapState、mapGetters不可用问题
Aug 03 Javascript
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 jQuery
原生JS实现顶部导航栏显示按钮+搜索框功能
Dec 25 Javascript
Vue实现tab导航栏并支持左右滑动功能
Jun 28 Vue.js
JavaScript 通过模式匹配实现重载
Aug 12 #Javascript
js更优雅的兼容
Aug 12 #Javascript
页面只有一个text的时候,回车自动submit的解决方法
Aug 12 #Javascript
javascript闭包的理解和实例
Aug 12 #Javascript
javascript 词法作用域和闭包分析说明
Aug 12 #Javascript
判断客户端浏览器是否安装了Flash插件的多种方法
Aug 11 #Javascript
基于JQuery的数字改变的动画效果--可用来做计数器
Aug 11 #Javascript
You might like
PHP的类 功能齐全的发送邮件类
2006/10/09 PHP
mysql5写入和读出乱码解决
2006/11/25 PHP
php中的curl_multi系列函数使用例子
2014/07/29 PHP
js代码实现微博导航栏
2015/07/30 PHP
ThinkPHP使用Smarty第三方插件方法小结
2016/03/19 PHP
php获取ajax的headers方法与内容实例
2017/12/27 PHP
JavaScript的目的分析
2007/01/05 Javascript
JS实现self的resend
2010/07/22 Javascript
js读取注册表的键值示例
2013/09/25 Javascript
window.onresize 多次触发的解决方法
2013/11/08 Javascript
JavaScript中使用指数方法Math.exp()的简介
2015/06/15 Javascript
jQuery实现带动画效果的多级下拉菜单代码
2015/09/08 Javascript
JS实现兼容性好,自动置顶的淘宝悬浮工具栏效果
2015/09/18 Javascript
详解javascript的变量与标识符
2016/01/04 Javascript
js利用appendChild对标签进行排序的实现方法
2016/10/16 Javascript
webpack学习--webpack经典7分钟入门教程
2017/06/28 Javascript
ionic3实战教程之随机布局瀑布流的实现方法
2017/12/28 Javascript
vue 的keep-alive缓存功能的实现
2018/03/22 Javascript
在小程序中使用Echart图表的示例代码
2018/08/02 Javascript
JavaScript禁用右键单击优缺点分析
2019/01/20 Javascript
vue组件数据传递、父子组件数据获取,slot,router路由功能示例
2019/03/19 Javascript
vue项目打包后怎样优雅的解决跨域
2019/05/26 Javascript
微信小程序实现吸顶效果
2020/01/08 Javascript
html2canvas属性和使用方法以及如何使用html2canvas将HTML内容写入Canvas生成图片
2020/01/12 Javascript
vue循环中点击选中再点击取消(单选)的实现
2020/09/10 Javascript
Django视图和URL配置详解
2018/01/31 Python
对Python中数组的几种使用方法总结
2018/06/28 Python
pandas.DataFrame的pivot()和unstack()实现行转列
2019/07/06 Python
Python测试线程应用程序过程解析
2019/12/31 Python
HTML5 新标签全部总汇(推荐)
2016/06/13 HTML / CSS
法国时尚童装网站:Melijoe
2016/08/10 全球购物
美国最大的万圣节服装网站:HalloweenCostumes.com
2017/10/12 全球购物
英国蛋糕装饰用品一站式商店:Craft Company
2019/03/18 全球购物
工会主席岗位责任制
2014/02/11 职场文书
Vue鼠标滚轮滚动切换路由效果的实现方法
2021/08/04 Vue.js
利用Java连接Hadoop进行编程
2022/06/28 Java/Android