Javascript extending methods

Question

The main.js has the following code

    APP.open = (function ($) {
    return {
      people: (function() {
        return {

          gender: function() {},

          age: function() {}
         }
       })()
     };
    }(jQuery));

and exteral.js has this:

    APP.open = (function ($) {
    return {
      people: (function() {
        return {
          race: function() {}
         }
       })()
     };
    }(jQuery));

exteral.js is loaded last so is overwriting main.js.

My question is, how should I write exteral.js in order to stop overwriting people method. I would like to extend APP.open.people method.

like as in you want the method in external to call the super (main.js) people as well as append its own code? — gbtimmon
– gbtimmon, Commented Apr 21, 2015 at 19:01
This is a good reading to learn how you should write your code to mimic inheritance in JS. github.com/getify/You-Dont-Know-JS/blob/master/… — marekful
– marekful, Commented Apr 21, 2015 at 19:04

Guffa · Accepted Answer · 2015-04-21 19:18:26Z

1

Add the specific method instead of replacing the entire APP.open namespace:

APP.open.people.race = function() {};

If you don't know which namespaces exist, add them first:

if (!'open' in APP) APP.open = {};
if (!'people' in App.open) App.open.people = {};

answered Apr 21, 2015 at 19:18

Guffa

703k111 gold badges760 silver badges1k bronze badges

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

Comments

MaxZoom · Accepted Answer · 2015-04-21 19:25:53Z

1

You need to stop appending to the jQuery as it is a bad programming habbit
You need to define your own space and use it for your code:

So the code will look like:

var LS = LS || {};
LS.open = function () {...}

and a call to it:

LS.open();

You can find more about JS modules here.

edited Apr 21, 2015 at 19:25

answered Apr 21, 2015 at 19:06

MaxZoom

7,7635 gold badges30 silver badges45 bronze badges

Comments

maque · Accepted Answer · 2015-04-21 19:09:40Z

0

In your external.js you can try something like this:

var APP = APP || {}; 
APP.open.people = function(){return {race:function(){}}};

answered Apr 21, 2015 at 19:09

maque

6821 gold badge6 silver badges11 bronze badges

Collectives™ on Stack Overflow

Javascript extending methods

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related