javascript - 递归调用作为对象返回的函数

Question

我有以下代码:

// Core Zoom Logic, independent of event listeners.
$.zoom = function(target, source, img) {
    var outerWidth,
        outerHeight,
        xRatio,
        yRatio,
        offset,
        position = $(target).css('position');

    // This part of code is omitted

    return {
        init: function() {
            outerWidth = $(target).outerWidth();
            outerHeight = $(target).outerHeight();
            xRatio = (img.width - outerWidth) / $(source).outerWidth();
            yRatio = (img.height - outerHeight) / $(source).outerHeight();
            offset = $(source).offset();
        },
        move: function (e) {
            var left = (e.pageX - offset.left),
                top = (e.pageY - offset.top);

            top = Math.max(Math.min(top, outerHeight), 0);
            left = Math.max(Math.min(left, outerWidth), 0);

            img.style.left = (left * -xRatio) + 'px';
            img.style.top = (top * -yRatio) + 'px';
        }, 
        automove: function() { 

          // can I recall this?

        }

    };
};

我想要实现的是在automove()函数中添加以下效果:

$(img).animate({
  top: newTop,
  left: newLeft,
  }, 1000, function() {
    automove(); /* recall */
  });

但是如何从它的主体中再次调用 automove 呢？也许我应该完全改变 $.zoom 函数中声明函数的方式？

Answer 1

如果您想从自身内部递归调用 automove()，传统方法是使用 arguments.callee 。所以代码看起来像这样:

return {

    /* ... */

    automove: function() { 

      $(img).animate({
          top: newTop,
          left: newLeft,
        }, 1000,
        arguments.callee /* recall */
      );

    }
}

但在 HTML5 中，这已被弃用，并且在严格模式下实际上是非法的。相反，您可以简单地为函数命名:

return {

    /* ... */

    automove: function myAutomove () { // <-- give it a name

      $(img).animate({
          top: newTop,
          left: newLeft,
        }, 1000,
        myAutomove /* recall */
      );

    }
}

命名函数表达式适用于所有新旧浏览器，并且更易于阅读。

<小时/>

注意:

如果函数不需要参数，您可以简单地将对其的引用作为回调传递，而不是将其包装在匿名函数中:

setTimeout(function(){ foo() },100); // <-- this is completely unnecessary

setTimeout(foo,100); // <-- just need to do this instead