SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Addict SLEE's Avatar
    Join Date
    Aug 2003
    Location
    uk
    Posts
    258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Revealing module pattern adding modules

    I am currently using he revealing module pattern in a project and i have a page that needs some js code to be used that will be quite large.
    I'd like to add this page's js as a module but it will only work if it can access the main modules private functions.
    Is this possible?

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by SLEE View Post
    I am currently using he revealing module pattern in a project and i have a page that needs some js code to be used that will be quite large.
    I'd like to add this page's js as a module but it will only work if it can access the main modules private functions.
    Is this possible?
    If you're attempting to access private modules, that is almost certainly a bad-code smell that indicates that something else should be done instead, for which well-known patterns and solutions are all but guaranteed to exist.

    Can you give us further information on what you're wanting to achieve, and what you're considering on doing?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Addict SLEE's Avatar
    Join Date
    Aug 2003
    Location
    uk
    Posts
    258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by paul_wilkins View Post
    If you're attempting to access private modules, that is almost certainly a bad-code smell that indicates that something else should be done instead, for which well-known patterns and solutions are all but guaranteed to exist.

    Can you give us further information on what you're wanting to achieve, and what you're considering on doing?
    Thanks for the reply. Essentially i have a main script that is using the revealing module pattern. I am now creating a new page that has some heavy js on it which i d rather have in a separate file and only include it on this page. The problem i have is that the main js file has some private functions that id like to use in the second file. I was hoping there would be a way to write it so the second file could be added to the main one.

    So if first file has a namespace of mod then i can in the second file use either mod.second for example or still use mod but add new functions to it.

    The main file has functions for Ajax calls and loaders and generic items i need to use in the second file.
    hope that helps

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by SLEE View Post
    Thanks for the reply. Essentially i have a main script that is using the revealing module pattern. I am now creating a new page that has some heavy js on it which i d rather have in a separate file and only include it on this page. The problem i have is that the main js file has some private functions that id like to use in the second file. I was hoping there would be a way to write it so the second file could be added to the main one.
    It's normally more beneficial to keep modules separate, so from what I've heard so far, it seems that it would be a good idea to either extract those private functions, or to provide a public interface for them so that the can be used.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Addict SLEE's Avatar
    Join Date
    Aug 2003
    Location
    uk
    Posts
    258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by paul_wilkins View Post
    It's normally more beneficial to keep modules separate, so from what I've heard so far, it seems that it would be a good idea to either extract those private functions, or to provide a public interface for them so that the can be used.
    I found a Sitepoitn article:

    http://www.sitepoint.com/modular-des...in-javascript/

    Where they use these functions but im not sure if this is good or not?

    Code:
    //protected utility functions
        utils =
        {
            //add properties to an object
            extend : function(root, props)
            {
                for(var key in props)
                {
                    if(props.hasOwnProperty(key))
                    {
                        root[key] = props[key];
                    }
                }
                return root;
            },
    
            //copy an object property then delete the original 
            privatise : function(root, prop)
            {
                var data = root[prop];
                try         { delete root[prop]; } 
                catch(ex)   { root[prop] = null; }
                return data;
            }
        };

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by SLEE View Post
    Where they use these functions but im not sure if this is good or not?
    It is not a good idea to chuck your code in to another module, just because you want to use some private parts from within there. There are better solutions to the problem.

    Can you give us more information about your specific situation?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #7
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    If you're after a nice modular approach that gives you a dependency management system as well, I would recommend using RequireJS. As an added advantage, it loads your scripts asynchronously.

    Get started by including RequireJS:
    HTML Code:
    <script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.6/require.min.js" data-main="scripts/main.js"></script>
    Note that the <script> has a data-main attribute that should point to your RequireJS configuration/bootstrap.

    For the purposes of this demo we'll assume we have the following file structure:

    Code:
    /scripts/main.js
    /scripts/app/app.js
    /scripts/app/some-module.js
    /scripts/lib/util.js
    /index.html
    We only need a really basic configuration file called "main.js":

    Code JavaScript:
    // Define the baseURL if your scripts live in a different directory than the
    // "main.js" that you indicated as the "main" script on the RequireJS script tag
    require.config({
        baseURL: "scripts"
    });
     
    // Define this module with it's only dependency being the app.js module.
    define(["app/app"],    function(App){ 
        "use strict"; 
        // we can do whatever here - I expose the 
        // main App to the window because it helps with debugging 
        window.App = App;
    });

    A module is defined as follows:
    Code JavaScript:
    define(["some/dependency/module1", "another/module2"], function(Module1, Module2) { 
     
        // RequireJS expects that an object of some sort is returned. 
        // This can be an object literal, an instantiated class, etc. 
     
        return { 
            something: "someValue" 
        }
    });

    I've set up a demo on http://afterlight.com.au/sitepoint/RequireJSSample/ (which includes a link to a ZIP file to download that example).

    Hope this helps
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  8. #8
    SitePoint Addict SLEE's Avatar
    Join Date
    Aug 2003
    Location
    uk
    Posts
    258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks AussieJohn i have used require js before but that doesnt help with my current problem which is using the module pattern to be able to have two modules that can use the main module's methods. Thank you for your detailed help.

    Paul: i currently have one script.js file that using the module pattern has many private methods and only 2 public methods. On a particular page i need to do bespoke code that will be quite large but only for this one page so i really do not want to load this on any other page. I want to be able to use 2 or 3 of the private methods on this page.i don't want to make them public and id rather not have to copy them over as maintaining them will be a pain. One of the main private methods is for ajax calls and some of the others id like to be able to use are for modal windows.

  9. #9
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SLEE View Post
    One of the main private methods is for ajax calls and some of the others id like to be able to use are for modal windows.
    Those sound like perfect methods to expose publicly so all other modules can see them. As Paul suggested earlier you could either put them in their own library/utility module or create a public accessor for them on their current module.
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  10. #10
    SitePoint Addict SLEE's Avatar
    Join Date
    Aug 2003
    Location
    uk
    Posts
    258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    is it not better to have your ajax function private?

  11. #11
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SLEE View Post
    is it not better to have your ajax function private?
    I'm sure from an (ideal) application design point of view there might be some benefits to having those methods private, however I tend to go with whichever approach is more pragmatic. Privacy is a question of "do I want to expose or hide this property?" - you'll need to weigh up the benefits of one over the other. In your case it makes perfect sense to expose these private methods publicly so your entire application can take advantage of them. It is of course also useful to create appropriate abstractions of those methods so they can be reused across your app with ease.

    If your application design is making your job hard, change the design
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  12. #12
    SitePoint Addict SLEE's Avatar
    Join Date
    Aug 2003
    Location
    uk
    Posts
    258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks for the advice


Tags for this Thread

Bookmarks

Posting Permissions

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