www.webdeveloper.com
Results 1 to 13 of 13

Thread: JS ovewrite method of class

  1. #1
    Join Date
    Dec 2009
    Posts
    6

    Question JS ovewrite method of class

    Hi all.

    I have a class in a file js:

    Code:
    MyClass = function() {
      this.myMethod = function() {
        alert("Please.... override me");
      }
      
      this.otherMethod = function() {
        alert("Please do not modify me");
      }
    }
    on the same HTML file I want to import another JS file that overwrite some methods of MyClass (only some !!!!). How can I do that without doing a copy and past of the whole class ?

    (I want to maintain the name MyClass as there are other JS files that I cannot modify that are using MyClass... )

    Thanks !

  2. #2
    Join Date
    Apr 2006
    Location
    Houston
    Posts
    1,374
    Something like this might work (have not tested)
    Code:
    currFunctions = MyClass;
    MyClass = function() {
    
      currFunctions();
    
      this.myMethod = function() {
        alert("over ridden");
      }
    
    }

  3. #3
    Join Date
    Dec 2009
    Posts
    6

    Cool

    nop.... it erases all the other methods... tks

  4. #4
    Join Date
    Sep 2009
    Posts
    52
    You could simply create a new instance of MyClass and override the methods eg.

    Code:
    var myClass2 = new MyClass();
    myClass2.myMethod = function() {
      alert('stuff');
    };

  5. #5
    Join Date
    Dec 2008
    Posts
    488
    Have you tried just setting the method without trying to include the others?

    Code:
    MyClass.myMethod = function () {
        //something else
    }
    If that doesn't work, you can try prototype.

    Code:
    MyClass.prototype.myMethod = function() {
        //something else
    }
    But i don't think prototype will replace an already existing method, as it is like redeclaring a function.

  6. #6
    Join Date
    Dec 2009
    Posts
    6
    I could... but I cannot as that class is used in files that I do not have access to...

    my HTML import few js:

    one.js
    two.js
    tree.js

    one.js defines MyClass and two.js and tree.js uses MyClass.... I want to create file myfile.js to import between one.js and two.js that modify MyClass...

  7. #7
    Join Date
    Dec 2009
    Posts
    6

    Cool

    Quote Originally Posted by jamesbcox1980 View Post
    Have you tried just setting the method without trying to include the others?

    Code:
    MyClass.myMethod = function () {
        //something else
    }
    If that doesn't work, you can try prototype.

    Code:
    MyClass.prototype.myMethod = function() {
        //something else
    }
    But i don't think prototype will replace an already existing method, as it is like redeclaring a function.
    yep... I've tried but it didn.t work... and you are right... prototype cannot override....

  8. #8
    Join Date
    Dec 2008
    Posts
    488
    Ok, I tested modifying the object, instead of the class. In other words, create your class, then define the object by declaring, var myObject = new Class(); Once the object has been created, THEN can you modify it's methods. However, you cannot modify methods of the browser's existing objects and classes, such as the document object or the Element class. Anyway, here's how I do it:

    Code:
    //Construct our class
    function MyClass(arg1) {
        //Make your arguments accessible to outside functions
        this.firstArgument = arg1;
        this.methodA = function() {
            alert(this.firstArgument);
        }
    }
    
    //Define the object
    var myObject = new MyClass("foo");
    
    //Create a function to change the object instead of the class
    function changeMethod() {
        myObject.methodA = function() {
            alert(myObject.firstArgument + " " + "bar");
        }
    }
    //Returns "foo":
    myObject.methodA();
    
    changeMethod();
    
    //Returns "foo bar":
    myObject.methodA();

  9. #9
    Join Date
    Dec 2009
    Posts
    6
    Thanks jamesbcox1980 , but it still doesn't do what I need... I need to overwrite a CLASS method... so that all the other JS that use obj = new MYCLASS() will work with my new class... I do not have controll on the other JS that uses the MYCLASS

  10. #10
    Join Date
    Dec 2008
    Posts
    488
    But you can't do that. You can't modify a class without redefining the entire thing. And even that is a violation of strict code practices... I thought JS might be different, since I haven't played a lot with classes in JS, but that's not the case.

    Honestly, this is a hack way of doing things, and you might rethink your methods.

  11. #11
    Join Date
    Aug 2009
    Posts
    593
    I have tried the below code and it seems to do what you are asking for:

    Code:
    //ORIGINAL CLASS DEFINITION
    MyClass = function()
    {
    	this.myMethod = function() {
    		alert("Please.... override me");
    	};
      
    	this.otherMethod = function() {
    		alert("Please do not modify me");
    	};
    }
    
    //OVERRIDE REQUIRED METHODS
    MyClassExt = function()
    {
    	this.myMethod = function() {
    		alert("You have overridden me");
    	};
    }
    MyClassExt.prototype = new MyClass();
    MyClass = MyClassExt;
    
    
    //TEST THE MODIFIED CLASS
    var class1 = new MyClass();
    class1.myMethod();
    class1.otherMethod();

  12. #12
    Join Date
    Dec 2008
    Posts
    488
    Cool... I didn't think of using prototype in that way. Pretty cool

  13. #13
    Join Date
    Dec 2009
    Posts
    6

    Thumbs up

    nice thraddash !

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles