JavaScript prototype problem

Question

If I call myRobot.Speak.sayHi() it always returns undefined. Please, what am I doing wrong? Thanks for reply!

var Factory = (function() {
 // Constructor 
 var Robot = function() {
 };
 // Public
 return {
 extendRobot: function(power, methods) {
 Robot.prototype[power] = methods;
 },
 createRobot: function() {
 return new Robot();
 }
 };
}());
Factory.extendRobot('Speak', {
 sayHi: function() {
 return 'Hi, ' + this.name;
 }
});
var myRobot = Factory.createRobot();
myRobot.name = 'Robin';
myRobot.Speak.sayHi() // => ‘Hi, Robin’

• ThiefMaster: You don't return anything so the method returns undefined. That's not a problem at all in this case.
• Emmitt Gregory: @ThiefMaster Fixed... Still the same.

Answer 1

createRobot: function() {
 var r = new Robot();
 for (var k in r.Speak) {
 if (typeof r.Speak[k] === "function") {
 r.Speak[k] = r.speak[k].bind(r);
 }
 }
 return r;
}

Rather then returning a new robot, make sure to bind all the methods in your powers to the robot.

To avoid hard coding in the loops try this:

Robot.powers = [];
...
extendRobot: function(power, methods) {
 Robot.powers.push(power);
 Robot.prototype[power] = methods;
},
createRobot: function() {
 var robot = new Robot();
 Robot.powers.forEach(function(power) {
 for (var method in robot[power]) {
 if (typeof robot[power][method] === "function") {
 robot[power][method] = robot[power][method].bind(robot);
 }
 }
 });
 return robot;
}

This relies on Function.prototype.bind so use the ES5 shim or use underscore for supporting old browsers (IE<9)

Answer 2

myRobot.Speak.name = 'Robin';

In your case, this refers to Robot.Speak, not the parent object Robot.

• Emmitt Gregory: Thanks for reply! Should I use apply or call?
• Emmitt Gregory: But... I would like to access variable myRobot.name from myRobot.Speak.sayHi. :-| Is it even possible?
• icktoofay: @Emmitt: Yes, it's possible, but it may make your code a little more complex.

Answer 3

insert name : this.name before the line sayHi: function() { and then it should work

• kqnr: No it won't, because this.name will refer to Factory.name when calling Factory.extendRobot
• icktoofay: @chomp: No, it won't; it will refer to window.name.