cocos creator 2.4 this.node.on方法中回调函数参数怎么传

for(let i = 0;i<3;i++){
           this.node.on(cc.Node.EventType.TOUCH_END,function(){
                this.buyBtn(i);
            },this);
}

    buyBtn:function(p1,p2){
        cc.log("点击成功" + p1);
    }

代码执行结果

img

for(let i = 0;i<3;i++){
           this.node.on(cc.Node.EventType.TOUCH_END,this.buyBtn(i),this);
}

    buyBtn:function(p1,p2){
        cc.log("点击成功" + p1);
    }

代码执行结果

img

为什么会这样?

第一种写法中,每次循环都会创建一个新的匿名函数作为回调函数,而且在回调函数中传入的参数 i 是一个闭包变量,每个匿名函数都引用了不同的 i,所以当点击按钮时,每个回调函数中的 i 都是最后一次循环的值 2。

而第二种写法中,this.buyBtn(i) 直接调用了 buyBtn 函数,并且将返回值作为回调函数,因为 buyBtn 函数没有返回值,所以回调函数为 undefined,所以点击按钮时没有任何反应。

正确的写法应该是将回调函数改为箭头函数,并在箭头函数中传入参数 i,如下所示:

for(let i = 0;i<3;i++){
           this.node.on(cc.Node.EventType.TOUCH_END,()=>{
                this.buyBtn(i);
            },this);
}
 
    buyBtn:function(p1,p2){
        cc.log("点击成功" + p1);
    }