Js闭包与循环
目标:点击任何一个li,提示当前点击位置
<ul>
<li>第1个</li>
<li>第2个</li>
<li>第3个</li>
<li>第4个</li>
<li>第5个</li>
</ul>
<script>
var li = document.getElementsByTagName('li');
for (var i = 0; i< li.length; i++){
li[i].onclick = function(){
alert("[2]:"+i); // [2]
}
alert("[1]:"+i) // [1]
}
</script>
1、先执行[1]位置,弹出5次警示框从0到4,执行的是for语句,i 在for内部已经变为5
2、li[i],是获取的li的HTMLCollection对象,i[i]相当于li.item(i)
3、为li[i]绑定事件,li[i].onclick 。实际上此时执行的匿名函数动态绑定的li[i],但是匿名函数是在全局中挂起(我将它理解为调用另一个函数),点击任何li弹出框都报出数字5。
修改成闭包:
<script>
var li = document.getElementsByTagName('li');
for (var i = 0; i< li.length; i++){ li[i].onclick = (function(num){
return function(){alert(num);}
})(i); }
</script>
每一个li[i],单独调用闭包后的函数,可以理解为每个li[i]单独传值制造函数。
理解闭包:
1. 视为正在执行新函数,且绑定在数据链上的函数,因此如果直接调用内部函数则会报错。(从新生成占用内存,因此谨慎使用)
var foo = {
baz: ,
bar: function() {
return (function(that){
return that.baz;
})(this)
}
};
console.log( foo.bar() ) // 1
2.闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),把内部变量当作它的私有属性(private value),这时一定要小心,不要随便。
3.闭包的执行。
var f = (
function f(){ return ""; },
function g(){ return ; }
)();
typeof f; // "number"
类似于
function f(){
function f(){
var a = ;
return a;
};
function g(){
var b =;
return b;
}
return LastOne() // lastone 代表最后执行的函数
};
console.log(f());
相关知识点:
1.作用域:
外部不能调用局部变量。但是可以通过返回函数这种变通的方法调用到局部变量
function f1(){
n=;
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); // 999 ,如果调用result会返回function f2()这个函数,加()代表执行
Js闭包与循环的更多相关文章
- JS闭包导致循环给按钮添加事件时总是执行最后一个
加入如下脚本代码: <script> var list_obj = document.getElementsByTagName('li'); for (var i = 0; i <= ...
- js闭包for循环总是只执行最后一个值得解决方法
<style> li{ list-style: none;width:40px;height: 40px;text-align:center;line-height: 40px;curso ...
- js闭包的作用域以及闭包案列的介绍:
转载▼ 标签: it js闭包的作用域以及闭包案列的介绍: 首先我们根据前面的介绍来分析js闭包有什么作用,他会给我们编程带来什么好处? 闭包是为了更方便我们在处理js函数的时候会遇到以下的几 ...
- js闭包理解实例小结
Js闭包 闭包前要了解的知识 1. 函数作用域 (1).Js语言特殊之处在于函数内部可以直接读取全局变量 <script type="text/javascript"> ...
- js闭包和ie内存泄露原理
也议 js闭包和ie内存泄露原理 可以, 但小心使用. 闭包也许是 JS 中最有用的特性了. 有一份比较好的介绍闭包原理的文档. 有一点需要牢记, 闭包保留了一个指向它封闭作用域的指针, 所以, 在给 ...
- js闭包实例汇总
本文是通过实例来帮助大家深刻理解js闭包,是篇非常不错的文章,这里推荐给大家,有需要的小伙伴可以参考下 Js闭包 闭包前要了解的知识 1. 函数作用域 (1).Js语言特殊之处在于函数内部可以直接读取 ...
- 关于js闭包之小问题大错误
闭包是 JavaScript 开发的一个关键方面:匿名函数可以访问父级作用域的变量. 如果闭包的作用域中保存着一个 HTML 元素,则该元素无法被销毁.(下面代码来自高程) 刚看到一个关于闭包自己没注 ...
- js闭包之我见
很久前的一个问题终于得以解决,内心是无比喜悦的,不多说,先上代码: function test(){ for(var i=0;i<5;i++){ window.onclick=function( ...
- js闭包引起的事件注册问题
背景:闲暇时间看了几篇关于js作用域链与闭包的文章,偶然又看到了之前遇到的一个问题,就是在for循环中为dom节点注册事件驱动,具体见下面代码: <!DOCTYPE html> <h ...
随机推荐
- 采购件不允许挂BOM
应用 Oracle Bill Of Materiel 层 Level Function 函数名 Funcgtion Name BOM_BOMFDBOM 表单名 Form Name BOMFDBOM ...
- 转: HTML5新特性之Mutation Observer
转: HTML5新特性之Mutation Observer Mutation Observer是什么 Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动 ...
- 强大的DELPHI RTTI–兼谈需要了解多种开发语言
一月 27th, 2005 by 猛禽 风焱在<“18般武艺”?>中说到他碰上的被多种语言纠缠的问题.我在回复里说: 很多语言只要能看懂几分就行了,没必要每一种都精通 但是如果只会很少的一 ...
- 扩展C++ string类
在实际开发过程中,C++string类使用起来有很多不方便的地方,笔者根据根据这些不足简单的扩展了这个类,如增加与数字之间的相互转化和格式化字符串.不足的地方望指正.读者也可以根据自己需求继续扩展. ...
- SQLServer2012 和 MariaDB 10.0.3 分页效率的对比
1. 实验环境 R910服务器, 16G内存 SqlServer 2012 64bit MariaDB 10.0.3 64bit (InnoDB) 2. 实验表情况 rtlBill ...
- Android中ViewStub组件使用
1. 概述: ViewStub组件和<include>标签的作用类似,主要是为了提高布局的重用性,及布局的模块化.它们之间最大的差别是,ViewStub中的布局不会随着它所在布局的渲染而渲 ...
- poj2013---二维数组指针使用
#include <stdio.h> #include <stdlib.h> #include<string.h> int main() { ; ][],arr2[ ...
- canvas学习笔记(一)-认识canvas
canvas是html5新增的一个标签,主要用于图形的绘制.我们可以把它理解为是浏览器给我们提供了一个画板,至于要绘制怎样的画卷,就看神笔马良你的主意了.而在canvas上绘制图形使用的笔,就是js了 ...
- 【和我一起学习Unity3D】Unity3D的坐标控制
坐标这个东西,在Unity3D里面是分为几个类的,各自是Vector2,Vector3.Vector4:含义各自是:二维坐标系,三维坐标系,四维坐标系.一般做游戏呢,用到的最多的就是Vector3了. ...
- loading android
drawal/loading.xml <?xml version="1.0" encoding="utf-8"?><animated-rota ...