Grow your CSS skills. Land your dream job.

Revealing Module Pattern Inheritance

  • # September 24, 2014 at 8:21 am

    Is there an obvious way to use any sort of inheritance with the Revealing Module pattern?

    For example, let’s say I have two modules:

    
    var NS = NS || {};
    
    NS.HelloModule = function(){
        var sayHi = function(){
            console.log("hi");
        },
    
        sayGoodbye = function(){
            console.log("goodbye");
        };
    
        return{
            sayHi: sayHi
        };
    }();
    
    NS.AlternateHelloModule = function(){
        // I'd like a function that will overwrite the hello function while keeping goodbye as-is.
    }();
    

    Is this even possible with JS with any type of module pattern? If not, s’all good. I’ve read that it can be done using prototypes but I’d need to rewrite more than it’s worth.

    __
    # September 24, 2014 at 9:09 am
    NS.AlternateHelloModule = function(){
        var helloModule = NS.HelloModule();
        helloModule.sayHi = function(){
            console.log("well hello agian");
        };
        return helloModule;
    }
    

    Or, if you want more inheritance:

    return Object.assign( 
        Object.create( NS.HelloModule ),
        { sayHi: function(){ /* … */ } } 
    );
    

    Object.assign is ES6 but it’s easy to polyfill. It’s basically jQuery’s .extend method.

    more here

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".