javascript, add function to prototype

Question

In javascript, is possible add functions to a prototype with something similar to a curry?

I try with this code

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');

and I get this output

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

but this way don't work, maybe because the this.state called in the functions is a this.state living in the global scope.

Answer 1

Yes, you just need to make the method invoke the fun callback on the receiver object. Use call:

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

Answer 2

It's because this inside func is not the instance of your class. It's the global object window. The anonymous function returned by helloGoodBye is the one that has its this set to the instance of the class (it is the function attached to the prototype). func is an anonymous function trapped in the closure, but it has nothing to do with the instance of the class itself.

Use an alternative to such as Function.prototype.call to explicitly specify the 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');