Javascript 回调的常见模式，但为什么？

我从未真正使用过JavaScript，但我大致知道它是关于什么的。现在我正在浏览一些chrome扩展的例子，我看到了很多这种“模式”

var Main = {
    enable: function(){ window.addEventListener('mousemove', onMouseMove, false); },
    onMouseMove: function(event){ _onMouseMove(event) },
    _onMouseMove: function(event){
        ...lenghty implementation...
    }
}

---

我的问题是，为什么？这是某种优化吗？

我不熟悉chrome扩展的一般实现方式，但当我使用这种模式时，它是专门保护我的实现的

通常，插件会公开某些属性和函数。该函数的用户可以轻松（甚至意外）重写您公开的函数。在这种情况下，如果在该函数中有实际的实现，它就不存在了

更新：现在你已经更新了问题

我个人认为将

onMouseMove

以及

\onMouseMove

作为对象的一部分公开没有多大价值。我见过一些javascript库是基于这样的假设编写的，即人们将“遵守约定”，并将前缀为

\uuu

的属性视为私有属性

也许，我会这样做：

var Main = function(){
   var _onMouseMove = function(event){ ... do stuff...};
   return {
       enable: function(){...},
       onMouseMove: _onMouseMove
   }
}

---

这种“模式”除了迷惑读者之外没有任何好处。

不，这不是任何优化（至少据我所知）

我对chrome扩展不太了解，只是偶尔读一些代码，没什么大不了的。但正如brightgarden所说，您所询问的模式是保护实现。在其他语言中，您有用于封装私有数据的内置机制。不是在js中。在我看来，这种粗略的、非常粗略的模块模式——brightgarden的答案中已经给出了这个例子。您可能想在这里阅读更多关于js中实现的设计模式的信息：

具体而言： 对于模块模式

---

与您的示例相比，实际的模块模式更好，也更容易混淆。

您的问题有点模糊；但我猜你是在问为什么开发人员有两个

onMouseMove

方法，而不是一次完成所有工作，即：

var Main = {
    onMouseMove: function(event) { 
        // Why not just have the implementation here?
        // Why are we delegating it to the other method?
        _onMouseMove(event) 
    },
    _onMouseMove: function(event){
        // ...length implementation...
    }
}

答案是因为如何。简而言之，大多数经典OOP语言（如Java）中的

this

键工作总是指函数范围内的父类（

Main

），JavaScript不是这样工作的

由于JavaScript中没有经典类，因此

this

关键字实际上是指调用它的函数；这就是为什么在通过构造函数创建新对象时，

new

关键字会产生如此大的差异；例如：

function MyConstructor = function () { 
    // Assign a member property
    this.aProperty = "An Example";
}

// Using the new keyword; a new scope is created for the call which refers to the
// object about to be created (and returned).
var withNew = new MyConstructor();
console.log(withNew.aProperty);  // 'An Example'

// Without the new keyword...
var withoutNew = MyConstructor();
console.log(withoutNew.aProperty);  // undefined

// Because we didn't use new, the calling function scope was applied, so 
// the `this` keyword resolves caller's scope.
console.log(this.aProperty)  // 'An Example'

通过从

onMouseMove

委托到

\u onMouseMove

范围将保持绑定到

主

对象，而不是绑定到触发鼠标事件的对象。另一种更具可读性的方法是使用委托，或者如果您使用ES5

---

看起来好像缺少一些代码；给定的代码无效。应该是完整的、简洁的和有代表性的。我从来没有见过它像这样做过三次（一个函数将事件附加到另一个调用第三个函数的函数上），但是，我在附加事件时几乎从不使用匿名函数，原因是我可以在不触发事件的情况下调用该函数。如果您添加了一些关于封装的内容，我会+1（不是像您在这里所做的那样间接，而是直接）…Parth：请随意。如果您添加一个更好的答案，我将很高兴+1您的答案并删除我的答案。：-）不错！我不是这么想的——范围太大了。

var Main = {
    enable: function() {
        window.addEventListener('mousemove', onMouseMove.bind(this), false); 
    },
    onMouseMove: function(event) { 
        // ...lengthy implementation...
    }
}