在对象方法中使用js回调

Question

在使用回调模式开发控制面板的模板时，我对代码被调用时执行的确切方式很感兴趣。在尝试了各种方法之后，我偶然发现了一些我不理解的模式。代码如下。我不太明白为什么在调用controlPanel.stuff()时ControlPanel.prototype.stuff()会被调用两次，谢谢！

var ControlPanel = function() {
this.onClickCallback = null;
this.mouseOverCallback= null;
};
var count = 0;

ControlPanel.prototype.handlers = function(callback) {
console.log('Registered handlers');
this.onClickCallback = callback;
this.mouseOverCallback = callback;
};

ControlPanel.prototype.stuff = function(dosmth){
console.log("cP got stuff!!!! "+ ++count);
if(count===1){dosmth();}};

ControlPanel.prototype.click = function(buttonColor) {
if (!this.onClickCallback || !this.mouseOverCallback) {
   return;
}
if (buttonColor === 'green') {
    this.onClickCallback('Life Is Good or So It Seems');
}
else if (buttonColor === 'red') {
    this.onClickCallback('Be Afraid Be Very Afraid...');
}
if (buttonColor === 'mouse') {
    this.mouseOverCallback( ' The Mouse Is Here...')
}
};

var controlPanel = new ControlPanel();
controlPanel.handlers(function(status) {  //Here is your callback function
//that gets stored in this.smth of controlPanel object
console.log('Received Callback');
console.log(status);
});
//Simple way to define a callback that executes when the controlPanel Object
//  is instantiated
controlPanel.stuff(function(){console.log('and this stuff is awesome!')});

controlPanel.stuff();
controlPanel.click('green');
controlPanel.click('red');
controlPanel.click('mouse');

Answer 1

您在代码中调用了它两次：

controlPanel.stuff(function(){console.log('and this stuff is awesome!')});

controlPanel.stuff();