I'm trying to override the play() method of the Audio object, but I don't want to do so just for a child object. I want to apply it to the standard Audio object.

The problem is I also want to use the original play() method. I've tried cloning the Audio object, making the changes, while calling the original Audio object's play() method and re-assigning back to the original Audio object. It doesn't work.

Ideas anyone? As an example, how could you add an alert() in the play() method while still calling the original play method?

plz. I need to do this because I have calling code generated by a tool that is calling new Audio. So it will be a super pain to constantly have to do a replace-all on this for the hundreds of code generations I'm doing.

I'm trying to override the play() method of the Audio object, but I don't want to do so just for a child object. I want to apply it to the standard Audio object.

The problem is I also want to use the original play() method. I've tried cloning the Audio object, making the changes, while calling the original Audio object's play() method and re-assigning back to the original Audio object. It doesn't work.

Ideas anyone? As an example, how could you add an alert() in the play() method while still calling the original play method?

plz. I need to do this because I have calling code generated by a tool that is calling new Audio. So it will be a super pain to constantly have to do a replace-all on this for the hundreds of code generations I'm doing.

• javascript
• html
• html5-audio
• prototypal-inheritance

Share Improve this question Follow edited Jun 12, 2012 at 9:12 Talha 19.3k88 gold badges5252 silver badges6666 bronze badges asked Jun 12, 2012 at 7:10 faceyspacey.faceyspacey. 2,63022 gold badges2222 silver badges3131 bronze badges 1

• 1 Can we see the code you tried? :-) – Florian Margaine Commented Jun 12, 2012 at 7:15

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

Audio.prototype.play = ( function( old ) {
   var a=1, b=2, c=3; // your 'private' variables - if needed;
   return function() {
      console.log( a+b+c );// do something   
      return old.apply( this, arguments );// return 'original' results
   }
} )( Audio.prototype.play );

Basically this could be done like this:

var playOriginal = Audio.prototype.play;
Audio.prototype.play = function(){
    playOriginal.apply(this, arguments);
}

But I'm not sure this will work for all browsers. Extending of native JS object is not remended in most cases.

You can save the original play method, then replace the play method with a new method that can call the original method whenever it wants to.

Audio.prototype.playOriginal = Audio.prototype.play;
Audio.prototype.play = function(){
    this.playOriginal.apply(this, arguments);
}