Javascript OOP - inheritance, prototyping, callback function

Question

I'm trying to use OOP in Javascript with inheritance, prototyping and callback functions. Would you please have a look at my JSfiddel http://jsfiddle.net/Charissima/5g6GV/. The first problem is solved already in Javascript OOP - inheritance and prototyping, but unfortunately the callback functions don't work any more.

        function Car () {    
            this.totalDistance = 0;
        };

        Car.prototype.putTotalDistance = function(distance) {
            this.totalDistance = distance;
        };

        Car.prototype.getTotalDistance = function() {
            return this.totalDistance;      
        };  

        Car.prototype.drive = function(distance) {
            this.totalDistance += distance;     
            return this.totalDistance;
        };


        function RaceCar () {};
        RaceCar.prototype = new Car();
        RaceCar.prototype.parent = Car.prototype;
        RaceCar.prototype.drive = function(distance) {
            return this.parent.drive.call(this, (distance * 2));
        };                     

        var myText;
        car = new Car;
        raceCar = new RaceCar;          

        car.putTotalDistance(200);
        myText = 'car totalDistance = ' + car.drive(10) + ' - ok<br>';

        raceCar.putTotalDistance(200);
        myText += 'raceCar totalDistance before drive = ' + raceCar.getTotalDistance() + ' - ok<br>';
        myText += 'raceCar totalDistance after drive = ' + raceCar.drive(10) + ' - ok<br><br>';                                                     

        car.putTotalDistance(0);            
        raceCar.putTotalDistance(100);
        var drivingFunctions = [car.drive, raceCar.drive];

        myText += drivingFunctions[0](10) + '<br>';
        try {
            myText += drivingFunctions[1](100) + '<br>';        
        }
        catch(err) {
            myText += err + + '<br>'
        }

        document.body.innerHTML = myText;

I don't see any use of callbacks in your code. Please state the actual problem more clearly directly in your question rather than relying on a link to another site (jsfiddle isn't always available). Describe the desired behaviour and the actual behaviour. What does "don't work any more" actually mean, e.g., is there an error in the browser's console, or does nothing happen, or does something happen but it's the wrong thing? — nnnnnn
– nnnnnn, Commented Oct 18, 2013 at 7:57
I don't want to use direct calls, but put the functions in an array: var drivingFunctions = [car.drive, raceCar.drive]; The first is for the base class, the second for the inherited class. Now I call drivingFunctions[0](10) and the result is NaN because this.totalDistance is undefined and I don't know why. — Karin Suel
– Karin Suel, Commented Oct 18, 2013 at 8:13
... Then I call drivingFunctions[1](100) and even worth, I get an exception with the error text "this.parent is undefined". I hope my explanation was clear enough. — Karin Suel
– Karin Suel, Commented Oct 18, 2013 at 8:19

grape_mao · Accepted Answer · 2013-10-18 08:20:58Z

2

You've put the two functions in an array, so when called, this get changed. You could use function bind :

   var drivingFunctions = [car.drive.bind(car), raceCar.drive.bind(raceCar)];

Here is an example to help you understand:

function Man(name){
    this.name = name;
    this.getName = function(){
      return this.name;  
    };
}
var man = new Man('toto');
var a = [man.getName];
console.log(a[0]());//undefined
a.name = 'titi';
console.log(a[0]());//titi, because this refers to the array.

edited Oct 18, 2013 at 8:20

answered Oct 18, 2013 at 8:12

grape_mao

1,1531 gold badge8 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Joe Minichino Over a year ago

I upvoted this answer because it resolves the OP's problem. However the problem is moot: I can't see a real-world scenario where you would object method calls in an array without resorting to more effective and elegant solutions that don't mess with this contexts.

grape_mao Over a year ago

@JoeMinichino you are right, I just show the OP where the problem is.

Joe Minichino Over a year ago

on this topic i wrote a little library that messes with this contexts on purpose , check it out here

Collectives™ on Stack Overflow

Javascript OOP - inheritance, prototyping, callback function

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related