javascript,给原型添加函数

javascript, add function to prototype

在 javascript 中,是否可以使用类似于咖喱的东西向原型添加功能?

我试试这个代码

var helloGoodBye = function (name, fun) {
  return function(message) {
    console.log('hello : ' + name);
    console.log(message);
    console.log('byebye : ' + name);
    return fun(message)
  }                                                                                           
}

var Machine = function (){
  this.state = 'green';
};

Machine.prototype = {
  green: helloGoodBye('green', function (message){
    this.state = 'red';
  }),
  red: helloGoodBye('red', function (message){
    this.state = 'green';
  })
}

var sm = new Machine();

sm[sm.state]('first message');
sm[sm.state]('second message');

我得到了这个输出

"hello state: green"
"first message"
"byebye state: green"
"hello state: green"
"second message"
"byebye state: green"

但是这种方式不行,可能是因为函数中调用的this.state是一个this.state在全局范围内的

因为func里面的this不是你的class的实例。它是全局对象 windowhelloGoodBye 返回的匿名函数是将其 this 设置为 class 实例的那个函数(它是附加到原型的函数)。 func是一个困在闭包中的匿名函数,但它与class本身的实例无关。

使用 Function.prototype.call 等替代方法明确指定 this:

var helloGoodBye = function (name, fun) {
  return function(message) {
    console.log('hello : ' + name);
    console.log(message);
    console.log('byebye : ' + name);
    return fun.call(this, message); // use the this in this scope which will be the instance of the object
  }                                                                                           
}

var Machine = function (){
  this.state = 'green';
};

Machine.prototype = {
  green: helloGoodBye('green', function(message) {
    this.state = 'red';
  }),
  red: helloGoodBye('red', function(message) {
    this.state = 'green';
  })
}

var sm = new Machine();

console.log(sm);
sm[sm.state]('first message');
sm[sm.state]('second message');

是的,您只需要使该方法调用接收器对象上的 fun 回调。使用 call:

function helloGoodBye(name, fun) {
  return function(message) {
    console.log('hello : ' + name);
    console.log(message);
    console.log('byebye : ' + name);
    return fun.call(this, message);
//            ^^^^^ ^^^^
  }                                                                                           
}