关于js for循环添加事件件时闭包的影响有哪些解法

js循环动态绑定带参数函数遇到的问题及解决方案[转]
发布时间: 4:18:58
编辑:www.fx114.net
本篇文章主要介绍了"js循环动态绑定带参数函数遇到的问题及解决方案[转]",主要涉及到js循环动态绑定带参数函数遇到的问题及解决方案[转]方面的内容,对于js循环动态绑定带参数函数遇到的问题及解决方案[转]感兴趣的同学可以参考一下。
众所周知,不带参数的绑定非常简单,只要使用(语法:“document.getElementById("对象ID名").attachEvent("事件名,如onchange",函数名);”)(示例:“document.getElementById("select_0").attachEvent("onchange",modifyFunction);”)即可。(注:以下只写示例) & 带参数的绑定就要复杂一些:document.getElementById("select _0").attachEvent("onchange",function(){modifyFunction (obj,i););即在function()中写需要执行的函数即可。当然还有另一种写法:document.getElementById("select _0"). onchange=function(){modifyFunction (obj,i););。 & 绑定成功,OK。不过,慢,此时又遇到了第二个问题,传递过去的参数值都是同一个,并不是想象中的将i的值传递过去后,每个绑定的函数的参数值都不一样。 & 于是乎,上网百度。经过艰难的搜索测试,期间还找到一个如下所示的例子: &script& document.onclick= function & check() { &&& if(event.srcElement.type== "button ") &&& alert(event.srcElement.name); }
&/script& &input & type=button & name=button1& &input & type=button & name=button2&
此例子是通过event找到有动作的组件,然后获取它的源,再取出name值。这样就可以通过传入的obj,获得是第几个obj,然后进行相应的操作。 & 只是还有个问题,经过这种操作之后,obj的值又出现了问题,不管操作哪个select,获得的值都是最后一个。 & 继续百度。 & 终于,在一篇文章中获得了原因。文章转帖如下: &
我们先看一个关于Javascript利用循环绑定事件的例子: 例如:一个不确定长度的列表,在鼠标经过某一条的时候改变背景。
以下为引用的内容: &!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&&& &html xmlns="http://www.w3.org/1999/xhtml" &&& &head&&& &&& &title&Untitled Page&/title&&& &/head&&& &body&&& &ul id="list"&&& &li&第1条记录&/li&&& &li&第2条记录&/li&&& &li&第3条记录&/li&&& &li&第4条记录&/li&&& &li&第5条记录&/li&&& &li&第6条记录&/li&&& &/ul&&& &script type="text/javascript"&&& &&& var list_obj = document.getElementById("list").getElementsByTagName("li"); //获取list下面的所有li的对象数组&&& &&& for (var i = 0; i &= list_obj. i++) {&&& &&&&&&& list_obj[i].onmousemove = function() {&&& &&&&&&&&&&& this.style.backgroundColor = "#cdcdcd";&&& &&&&&&& }&&& &&&&&&& list_obj[i].onmouseout = function() {&&& &&&&&&& this.style.backgroundColor = "#FFFFFF";&&& &&&&&&& }&&& &&& }&&& &/script&&& &/body&&& &/html& 这个例子循环为一组对象绑定事件处理函数。 但是,如果我们在这个基础上增加一些需求。比如在点击某一条记录的时候弹出这是第几条记录? 肯能你会理所当然的这么写:
以下为引用的内容: &!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&&& &html xmlns="http://www.w3.org/1999/xhtml" &&& &head&&& &&& &title&Untitled Page&/title&&& &/head&&& &body&&& &ul id="list"&&& &li&第1条记录&/li&&& &li&第2条记录&/li&&& &li&第3条记录&/li&&& &li&第4条记录&/li&&& &li&第5条记录&/li&&& &li&第6条记录&/li&&& &/ul&&& &script type="text/javascript"&&& &&& var list_obj = document.getElementById("list").getElementsByTagName("li"); //获取list下面的所有li的对象数组&&& &&& for (var i = 0; i &= list_obj. i++) {&&& &&&&&&& list_obj[i].onmousemove = function() {&&& &&&&&&&&&&& this.style.backgroundColor = "#cdcdcd";&&& &&&&&&& }&&& &&&&&&& list_obj[i].onmouseout = function() {&&& &&&&&&&&&&& this.style.backgroundColor = "#FFFFFF";&&& &&&&&&& }&&& &&&&&&& list_obj[i].onclick = function() {&&& &&&&&&&&&&& alert("这是第" + i + "记录");&&& &&&&&&& }&&& &&& }&&& &/script&&& &/body&&& &/html& 测试一下你会发现alert出来的都是:这是第6记录其实这里for循环已将整个列表循环了一遍,并执行了i++,所以这里i变成了6,有什么好的办法解决这个问题吗?那就是闭包了,个人认为闭包是js中最难捉摸的地方之一, 看看什么是闭包:闭包时是指内层的函数可以引用存在与包围他的函数内的变量,即使外层的函数的执行已经终止。 这个例子中我们可以这样做:
以下为引用的内容:&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&&& &html xmlns="http://www.w3.org/1999/xhtml" &&& &head&&& &&& &title&Untitled Page&/title&&& &/head&&& &body&&& &ul id="list"&&& &li&第1条记录&/li&&& &li&第2条记录&/li&&& &li&第3条记录&/li&&& &li&第4条记录&/li&&& &li&第5条记录&/li&&& &li&第6条记录&/li&&& &/ul&&& &script type="text/javascript"&&& &&& function tt(nob) {&&& &&&&&&& this.clickFunc = function() {&&& &&&&&&& alert("这是第" + (nob + 1) + "记录");&&& &&&&&&& }&&& &&& }&&& &&& var list_obj = document.getElementById("list").getElementsByTagName("li"); //获取list下面的所有li的对象数组&&& &&& for (var i = 0; i &= list_obj. i++) {&&& &&&&&&& list_obj[i].onmousemove = function() {&&& &&&&&&&&&&& this.style.backgroundColor = "#cdcdcd";&&& &&&&&&& }&&& &&&&&&& list_obj[i].onmouseout = function() {&&& &&&&&&&&&&& this.style.backgroundColor = "#FFFFFF";&&& &&&&&&& }&&& &&&&&&& var col = new tt(i);&&& &&&&&&& list_obj[i].onclick = col.clickF&&& &&& }&&& &/script&&& &/body&&& &/html& &&
PS:闭包很难,很复杂! & 经过以上文章可以得知,引起这个问题的原因其实是因为js的闭包难题。按照面向对象的JAVA语言的理解可以解释为:js循环动态绑定带参数函数中的参数,其实相当于java中的引用传递,而非值传递。传递进来的引用只相当于一个指针,指向的是一个内存地址,这个内存地址存放的才是具体的值,而外面的循环会不断的修改这个存放地址中的值,所以最后循环结束之后,参数的值只能找到最后一个。 & 知道了原因就很好解决了。New一个新的“函数类”(姑且这么称呼吧)。测试OK。一下是修改后的代码: //在新增按钮上绑定函数 document.getElementById("add").attachEvent("onclick",addFunction); var jc_count = 0;//定义需要改变第几行的值 & function txzmcFunction(x,y){//下拉框中绑定的函数 &&&&&&&&&&&&&&&&&&&&&&&&&&& var sql="select txzjc from dm_txzmc where dm='"+x.value+"'";//取得下拉框中的代码,通过ajax获得相应的中文名称 &&&&&&&&&&&&&&&&&&&&&&&&&&& jc_count =//定义当前行是第几行 &&&&&&&&&&&&&&&&&&&&&&&&&&& ajaxSelect(sql,"txzjcFunction");//封装的ajax函数 } & function txzjcFunction(x){//接收封装的ajax函数返回值,并赋值 &&&&&& document.getElementById("_subarea_hxax_clzjxxb_hxax_txzxxb_update_txzjc_"+jc_count).value=x; } & function bb(dx,sz){//解决动态绑定闭包问题要用到函数 &&&&&&&&&&&&&&&&&&&& this.clickFunc=function(){ &&&&&&&&&&&&&&&&&&&&&&&&&&& txzmcFunction(dx,sz);//调用相应的函数 &&&&&&&&&&&&&&&&&&&& } } & function addFunction(){ //动态循环绑定 &&&&&&&&&&&&&&&&&&&& var count=document.getElementById("_subarea_hxax_clzjxxb_hxax_txzxxb_update_maxcount").//获取最大的行数 &&&&&&&&&&&&&&&&&&&& for (var i=0;i&i++ )//循环绑定 &&&&&&&&&&&&&&&&&&&& { &&&&&&&&&&&&&&&&&&&&&&&&&&& var obj=document.getElementById("_subarea_hxax_clzjxxb_hxax_txzxxb_update_txzmc_" +i); &&&&&&&&&&&&&&&&&&&&&&&&&&& var tp = new bb(obj,i);//解决闭包问题,new一个新的函数类 &&&&&&&&&&&&&&&&&&&&&&&&&&& obj.onchange = tp.clickF &&&&&&&&&&&&&&&&&&&& } } //显示页面时执行一次 addFunction();
本文标题:
本页链接:看个js闭包问题_javascript吧_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名:今日本吧第个签到,本吧因你更精彩,明天继续来努力!
本吧签到人数:0成为超级会员,使用一键签到本月漏签0次!成为超级会员,赠送8张补签卡连续签到:天&&累计签到:天超级会员单次开通12个月以上,赠送连续签到卡3张
关注:124,845贴子:
看个js闭包问题收藏
for(var i=0;i&10;i++){if(i==0){setTimeout(function(){console.log(i);},1000);}}这个代码为什么输出10呢?我一直没有想明白。求高人指教。
“健康随e保”可保障儿童41种重大疾病。150元起/年,给孩子45万高额保障。
开启个循环{如果i=0 条件成立 就开启个定时器 这个时候i已经开始走 从0走到10 }再结束了 结束了就输出最终结果 就成了10 了
应该是一秒后for循环已经走完了吧
for(var i = 0; i & 10; ++i) {
(function (i) {
if(i === 0){
setTimeout(function() {
//console.log(i);
在你整段代码中只有一个i,因为闭包所以它的生命周期延长了。setTimeout里所使用的 i 就是你声明好的 i, 如果你知道C/C++里的指针,可能更能理解这个问题。你声明var i的时候, 内存中分配了一个给 i 的地址,假设是 x,然后你在 i = 0的时候,告诉setTimeout函数,我要用这个i,setTimeout函数不会知道 i 是啥,它只知道 i 在内存中的地址是 x。所以你后来不断地对 内存 x 所存储的值递增,最后x存的是10,1秒后读到的就是10
╭(╯ε╰)╮
这个完全符合我上面所说的。你可能不太理解在什么情况下,程序会向内存申请一块新的存储空间。比如 var i = 5;function fn(i) {
console.log(i);}fn(5);这时候会输出6,但全局空间的 i 值还是 5.同理在调用innerFn2(a)函数时,函数会为形参a申请一个新的内存地址,然后把传进来的值赋给它。因此在你的第二个例子中,实际出现了11个不同的a
setTimeout执行时会将当前函数放在事件队列外面,去执行队列中的代码,当到达自定义的时间时,才会将要执行的代码塞到队里里。换句话说 ,你那个函数没执行时,for已经走完了。ps:setTimeout的时间并不准确,只会大于等于设定时间。用闭包解决的关键一个是作用域链,另外一个就是js的值传递机制。lz闭包肯定不了解,光说是没用的。
这个问题其实跟闭包没多大关系这是JS的异步特性引起的。setTimeout意思是你们先跑,我在后面等你们空闲的时候再执行。for(var i =0; i & 1e5; i++) {console.log('start');setTimeout(function() {console.log('2');},1000);console.log('end');};可以知道setTimeout是在for循环结束之后才执行的在for循环结束之后 i 到多少,结果就是多少。如果还不理解,可以自行百度   javascript 异步
setTimeout里保存的是变量i的引用,并且因为是异步的特性,这时候i的引用已经因为for跑完的缘故是10了...
票牛教你如何买到热门、便宜、真实的演出门票!
i 就有一个,for循环完 i 就变成了10,然后执行settimeout里面的函数,所以打印出来的是10.
setTimeout是计数器,相当于隔多少时间后在执行这个代码;从执行顺序来说,先执行for()循环,然后开启这n个计数器.当计数器时间到了时候,才会把计数器里面函数插入js队列,但此时的i已经循环到10.因此会输出10
除非你的电脑巨慢
我不理解楼主为什么不理解它输出10,,难道输出11?
这输出10不是很正常么。你console.log(i)在1秒以后才执行,计算机1秒钟可以计算几十亿次,你区区10个循环。。。i早就等于10了哇
i 是变量,在循环中一直在累加循环第一次i=0的时候,触发settimeout 控制在1秒以后输出变量i然后继续循环1秒后,settimeout输出i 这个时候循环已经走完了,i被累加到10所以输出的是10ps:你可以把settimeout看成一个新的线程,这样容易想通点
你输出的时候i已经变成10了哇~这里的参数i.指向i的存储地址~循环一直在修改i.的值~你取的时候当然是取当前i的值啊
这个i的作用域是全局的,因为你是在外部定义的。其实你只要在循环里面var一个变量,然后把i赋值给它,就能按顺序输出了
定时器一秒后开启,够for循环上万次了。
赤裸裸的闭包哦
曾经在一个工资贴上看到楼主,楼主不是说对自己的JS基础十分有信心,当时我还想有个牛人....可是这个基础的异步和闭包也不了解。是不行的呀。大家都说了,是异步和闭包的问题,我就说一下怎么解决。两种,一个是手动建立闭包,让回调函数不直接引用循环里的i,有多少个i就有多少个闭包。另一个就是使用不太兼容(傻逼IE)也不太常见的forEach作循环,使用里面的参数index,就可以避免这个问题,详情,可见我的文章
我同意九楼的看法。问题主要是在setTimeout()上。把setTimeout()看成一个定时器,每次循环到这个语句是新建了一个定时器,但这个定时器还没有开始计时。我猜测这个应该是所有语句运行完后,设定的定时器才开始计时。
当初有人问我Ajax的实现原理是不是闭包,我心里默默的回了一句,尼玛。
干嘛动不动就跟闭包扯上关系,完了再把自己绕进去呢?这个实例,把定时器去掉,直接弹出i看看,要理解for循环
挺好的例子。稍微修改一下,闭包、setTimeout的特点都能考到都知道函数的执行是分两步的:第一步是进入执行环境(确定this、arguments、完成内部变量声明),第二步才是执行函数。setTimeout函数延迟(异步)比起一般的函数特殊之处在于,他的延迟体现在第二步的执行上,而第一步是不延迟的举LZ例子修改下:for(var i=0; i&5; i++){
setTimeout(
document.write(i + &&br /&&) , 5000)} //输出0,1,2,3,4 。可以看出延迟的只是第二阶段。第一阶段(确定arguments、this、完成变量声明)不参与延迟,document.write可以看做是个自执行函数,因此在传参的时候直接就执行了,效果就是瞬间输出0(等于延迟的效果无效,因为传参阶段就输出了)。for(var i=0; i&5; i++){
setTimeout(
function(){document.write(i + &&br /&&)} , 5000)}//这样是有延迟的输出10。函数不是自执行函数,延迟5000ms后才调用,才引发内部的doucment.write。由于异步延迟,此时外部i已经变为10。固输出10for(var i=0; i&5; i++){
setTimeout(
(function(i){document.write(i + &&br /&&)})(i) , 5000)}//这样是有延迟的0。用了闭包其实setTimeout特殊的地方挺多的。普通函数比如无论在哪里调用都在哪里执行。这个函数无论在哪儿调用最终执行时候都是在全局...如果不明白这些特点会导致一些无意识的闭包的生成占用内存或者第一个参数写在“”之间在做字符串处理,导致在全局中执行时找不到发生undefined。&script&window.onload = function{
//各位可以在这里自己试验下}&script&
定时器和事件是一样的 最后都显示最后的数字
登录百度帐号推荐应用
为兴趣而生,贴吧更懂你。或你必须知道的【闭包】陷阱和案例
In some languages, a closure may occur when a function is defined within another function, and the inner function refers to local variables of the outer function.
At run-time, when the outer function executes, a closure is formed, consisting of the inner function&s code and references (the upvalues) to any variables of the outer function required by the closure.
在一些语言当中,闭包发生& :在一个函数内部定义了另外一个函数,并且内部的函数引用了外部函数的本地变量。
在运行的时候,当外部函数执行,这个时候形成了一个闭包,由内部函数的代码和对外部函数任意变量引用组成,这写引用都依赖于此闭包。
// ECMAScript
function foo() {
&&& var x = 0;
&&& f = function () { return ++x; };
&&& g = function () { return --x; };
&&& x = 1;
&&& alert('inside foo, call to f(): ' + f()); // &2&
//外部函数执行,这个时候形成了闭包
//因为有了闭包,所以才访问到了 foo中的x
alert('call to g(): ' + g()); // &1&
//因为有了闭包,所以才访问到了 foo中的x
alert('call to f(): ' + f()); // &2&
javascript闭包陷阱与案例
在很多时候,由于内部函数的变量覆盖了闭包的变量,我们如果需要引用外部函数同名的变量,需要通过执行匿名函数,不外部函数的变量作为参数传递进来。如下所示:
(function(out_xxx){
//这里面就可以使用out_xxx
可以看得出来,使用这种方式最多的地方是在我们定义对象的时候:
(function (window) {
&&& var MyObject = function () {
&&&&&&& this.initialize();
&&& var p = DisplayObject.
&&& p.initialize = function () {
&&& window.MyObject = MyO
} (window));
这样定义对象有两个好处:
1.避免污染外部变量
2.传递参数的形式减少作用域查找
javascript为我们埋了很多坑,在许多场景下,我们需要利用以上的形式去解决问题,下面依依列出。
如下所示,我需要在cc方法中调用到外面的name:
&&& var bb,
&&& function aa() {
&&&&&&& var name = &当耐特&;
&&&&&&& bb = function () {
&&&&&&&&&&& var name = &砖家&;
&&&&&&&&&&& cc = function () {
&&&&&&&&&&&&&&& var name = &张磊&;
&&&&&&&&&&&&&&& alert(name);
&&&&&&&&&&& }
&&&&&&& aa();
&&&&&&& bb();
&&&&&&& cc();//输出 &张磊&
因为内部的函数定义的变量覆盖了外部函数的变量,所以结果输出&张磊&。
解决办法:
&&& var bb,
&&& function aa() {
&&&&&&& var name = &当耐特&;
&&&&&&& (function (aa_name) {
&&&&&&&&&&& bb = function () {
&&&&&&&&&&&&&&& var name = &砖家&;
&&&&&&&&&&&&&&& (function (bb_name, aa_name) {
&&&&&&&&&&&&&&&&&&& cc = function () {
&&&&&&&&&&&&&&&&&&&&&&& var name = &张磊&;
&&&&&&&&&&&&&&&&&&&&&&& alert(aa_name);
&&&&&&&&&&&&&&&&&&&&&&& alert(bb_name);
&&&&&&&&&&&&&&&&&&&&&&& alert(name);
&&&&&&&&&&&&&&&&&&& }
&&&&&&&&&&&&&&& })(name, aa_name);
&&&&&&&&&&& }
&&&&&&& })(name);
&&&&&&& aa();
&&&&&&& bb();
&&&&&&& cc();//输出&当耐特& &砖家&& &张磊&
真实案例:
记得上周,我的一个同事(实习生),对下面一段代码产生疑惑,所以咨询我。如下所示:
&&& $(&#dialog-form&).dialog({
&&&&&&& autoOpen: false,
&&&&&&& height: 300,
&&&&&&& width: 350,
&&&&&&& modal: true,
&&&&&&& buttons: {
&&&&&&&&&&& &Create an account&: function () {
&&&&&&&&&&&&&&& var bValid =
&&&&&&&&&&&&&&& allFields.removeClass(&ui-state-error&);
&&&&&&&&&&&&&&& bValid = bValid && checkLength(name, &username&, 3, 16);
&&&&&&&&&&&&&&& bValid = bValid && checkLength(email, &email&, 6, 80);
&&&&&&&&&&&&&&& bValid = bValid && checkLength(password, &password&, 5, 16);
&&&&&&&&&&&&&&& if (bValid) {
&&&&&&&&&&&&&&&&&&& $.ajax({
&&&&&&&&&&&&&&&&&&&&&&& type: &POST&,
&&&&&&&&&&&&&&&&&&&&&&& url: &xxxxx.x&,
&&&&&&&&&&&&&&&&&&&&&&& data: &name=xxxxx&email=xxxxx&password=xxxx&
&&&&&&&&&&&&&&&&&&& }).done(function (msg) {
&&&&&&&&&&&&&&&&&&&&&&& alert(&Data Saved: & + msg);
&&&&&&&&&&&&&&&&&&&&&&& $(this).dialog(&close&);
&&&&&&&&&&&&&&&&&&& });
&&&&&&&&&&&&&&& }
&&&&&&&&&&& },
&&&&&&&&&&& Cancel: function () {
&&&&&&&&&&&&&&& $(this).dialog(&close&);
&&&&&&&&&&& }
&&&&&&& },
&&&&&&& close: function () {
&&&&&&&&&&& allFields.val(&&).removeClass(&ui-state-error&);
这里用的是JqueryUI的dialog插件。详见: &&
他想要的效果是点击create发起一个异步提交,然后在回调的时候关闭弹出层。令他困惑的地方是,弹出层关闭不了。
他抱怨着说:
Cancel: function () {
&&&&&&&&&&&&&&& $(this).dialog(&close&);
&&&&&&&&&&& }
我的cancel都能关闭。为什么
&&&&&&&&&&&&&&& if (bValid) {
&&&&&&&&&&&&&&&&&&& $.ajax({
&&&&&&&&&&&&&&&&&&&&&&& type: &POST&,
&&&&&&&&&&&&&&&&&&&&&&& url: &xxxxx.aspx&,
&&&&&&&&&&&&&&&&&&&&&&& data: &name=xxxxx&email=xxxxx&password=xxxx&
&&&&&&&&&&&&&&&&&&& }).done(function (msg) {
&&&&&&&&&&&&&&&&&&&&&&& alert(&Data Saved: & + msg);
&&&&&&&&&&&&&&&&&&&&&&& $(this).dialog(&close&);
&&&&&&&&&&&&&&&&&&& });
&&&&&&&&&&&&&&& }
这里面的$(this).dialog(&close&)为什么就不能关闭?
这是一个很典型的场景,解决办法:
&&&&&&&&&&&&&&& if (bValid) {
&&&&&&&&&&&&&&&&&&& (function (outThis) {
&&&&&&&&&&&&&&&&&&&&&&& $.ajax({
&&&&&&&&&&&&&&&&&&&&&&&&&&& type: &POST&,
&&&&&&&&&&&&&&&&&&&&&&&&&&& url: &xxxxx.aspx&,
&&&&&&&&&&&&&&&&&&&&&&&&&&& data: &name=xxxxx&email=xxxxx&password=xxxx&
&&&&&&&&&&&&&&&&&&&&&&& }).done(function (msg) {
&&&&&&&&&&&&&&&&&&&&&&&&&&& alert(&Data Saved: & + msg);
&&&&&&&&&&&&&&&&&&&&&&&&&&& $(outThis).dialog(&close&);
&&&&&&&&&&&&&&&&&&&&&&& });
&&&&&&&&&&&&&&&&&&& }
&&&&&&&&&&&&&&& }(this))
&&&&&&&&&&& },
场景2---循环中的内部函数
&&& function TestObj(name) {
&&&&&&& this.name =
&&& var objs = [];
&&& function test() {
&&&&&&& for (var i = 0; i & 100; i++) {
&&&&&&&&&&& var name = &张磊& +
&&&&&&&&&&& obj = new TestObj(name);
&&&&&&&&&&& obj.printName = function () {
&&&&&&&&&&&&&&&&&&& console.log(obj.name);
&&&&&&&&&&&&&&& }
&&&&&&&&&&& objs.push(obj);
&&& //外部函数执行,闭包形成。内部函数obj.printName中的obj全部指向最后一次new TestObj(name);
&&& test();
&&& //所以这里会输出100次-----&张磊99&
&&& for (var i in objs) {
&&&&&&& objs[i].printName();
&&& function TestObj(name) {
&&&&&&& this.name =
&&& var objs = [];
&&& function test() {
&&&&&&& for (var i = 0; i & 100; i++) {
&&&&&&&&&&& var name = &张磊& +
&&&&&&&&&&& obj = new TestObj(name);
&&&&&&&&&&&&& (function (target) {
&&&&&&&&&&& obj.printName = function () {
&&&&&&&&&&&&&&& console.log(target.name);
&&&&&&&&&&& }
&&&&&&&&&&&&&& } (obj))
&&&&&&&&&&& objs.push(obj);
&&& test();
&&& for (var i in objs) {
&&&&&&& objs[i].printName();
真实案例:
// create and populate the screen with random daisies:
for(var i = 0; i & 100; i++){
&&& bitmap = new Bitmap(image);
&&& container.addChild(bitmap);
&&& bitmap.x = canvas.width * Math.random()|0;
&&& bitmap.y = canvas.height * Math.random()|0;
&&& bitmap.rotation = 360 * Math.random()|0;
&&& bitmap.regX = bitmap.image.width/2|0;
&&& bitmap.regY = bitmap.image.height/2|0;
&&& bitmap.scaleX = bitmap.scaleY = bitmap.scale = Math.random()*0.4+0.6;
&&& bitmap.name = &bmp_&+i;
&&& // wrapper function to provide scope for the event handlers:
&&& (function(target) {
&&&&&&& bitmap.onPress = function(evt) {
&&&&&&&&&&& // bump the target in front of it's siblings:
&&&&&&&&&&& container.addChild(target);
&&&&&&&&&&& var offset = {x:target.x-evt.stageX, y:target.y-evt.stageY};
&&&&&&&&&&& // add a handler to the event object's onMouseMove callback
&&&&&&&&&&& // this will be active until the user releases the mouse button:
&&&&&&&&&&& evt.onMouseMove = function(ev) {
&&&&&&&&&&&&&&& target.x = ev.stageX+offset.x;
&&&&&&&&&&&&&&& target.y = ev.stageY+offset.y;
&&&&&&&&&&&&&&& // indicate that the stage should be updated on the next tick:
&&&&&&&&&&&&&&& update =
&&&&&&&&&&& }
&&&&&&& bitmap.onMouseOver = function() {
&&&&&&&&&&& target.scaleX = target.scaleY = target.scale*1.2;
&&&&&&&&&&& update =
&&&&&&& bitmap.onMouseOut = function() {
&&&&&&&&&&& target.scaleX = target.scaleY = target.
&&&&&&&&&&& update =
&&& })(bitmap);
这是Easeljs官网demo的一段代码,因为内部函数不会立即执行,所以当执行的时候,内部函数引用外部函数变量的时候,该变量已经被外层的for循环覆盖了N次,所以要通过上面的方式来解决这个问题。
这是javascript蹩脚的一个方面,除了这个,还有javascript的 getter和setter也是该语言语法特性中令人憋屈的地方。
我相信经过人类的不懈努力,总有那么一天:static 、namespace、interface、private、protected 、class、enum&&&&&&&&&&&&&都能成为javascript的关键字,而不是五花八门的技巧,对应这些关键字的所有 文章 笔记& 心得& 日记 技巧 随笔 后门& 都将沉尸谷底、永无翻身之日。相信那个时候,HTML5已经成熟。正如小胖所说:什么时候做html5游戏的朋友能够不再纠结于什么js技巧 canvas性能优化的,那就说明html5游戏这个领域成熟了。
&摘自 当耐特砖家--
(window.slotbydup=window.slotbydup || []).push({
id: '2467140',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467141',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467142',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467143',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467148',
container: s,
size: '1000,90',
display: 'inlay-fix'

我要回帖

更多关于 js循环添加事件 的文章

 

随机推荐