javascript - 如何在JavaScript中扁平化touchmove监听器？

Trickshot #29显示如何在jQuery中定义触摸事件。我已经将其重新编写为this fiddle中的流氓写作风格。

作者要做的是在触发touchstart事件时定义一个touchmove侦听器。

request.dom.ball.on('mousedown touchstart',myTouchStart);
function myTouchStart(myEvent){
   request.dom.ball.on('mousemove.myNameSpace touchmove.myNameSpace',myTouchMove);
   function myTouchMove(myEvent) {

我想做的就是将myTouchMove放在myTouchStart之外，因为我的流氓JavaScript编写风格是尝试使其尽可能平整，并且如果可以的话，不要在函数内部包含函数。

这似乎很奇怪，因为我已经将所有内容包装在其中：

(function() {
})();

首先，但是如果可以的话，我真的不想在函数内部包含函数。

最佳答案

一种实现方法是从另一个函数（称为闭包）返回内部函数，该函数会将您最初引用的任何变量传递给原始函数。

据我所知，这只是一个变量-local-但是，如果要添加新变量，只需在函数定义和函数调用中添加一个新参数即可。

更新的小提琴：http://jsfiddle.net/ynUHb/1/

受影响的代码：

request.dom.ball.on('mousedown touchstart',myTouchStart);

function myTouchStart(myEvent){
    var local = {};
    //...
    request.dom.ball.on('mousemove.myNameSpace touchmove.myNameSpace',myTouchMove(local));
    //...
};

function myTouchMove(local) {
    return function(myEvent) {
        var myCss = {};

        myEvent = (myEvent.originalEvent.touches) ? myEvent.originalEvent.touches[0] : myEvent;
        myCss.top = local.elementPosition.y + myEvent.pageY - local.startPosition.y;
        request.dom.top.text(myCss.top);
        myCss.left = local.elementPosition.x + myEvent.pageX - local.startPosition.x;
        request.dom.left.text(myCss.left);
        request.dom.ball.css(myCss);
    };
};

看到：


Forming Closures