JS/jQuery - Advice on Creating a Variable that can be used in multiple functions

Question

I'd like to create a a series of variable like follows that have settings per each:

var panel_myfeed = new Array();
panel_myfeed[0]="/myfeed";
panel_myfeed[1]="#view-panel-myfeed";
panel_myfeed[2]="XXXXXXXX";

var panel_OtherPanel = new Array();
panel_OtherPanel[0]="/otherurl";
panel_OtherPanel[1]="#other-url-panel";

var panel_OtherPanel2 = new Array();
panel_OtherPanel2[0]="/otherurl2";
panel_OtherPanel2[1]=".other-url-panel2";

Then I want to have two separate functions that can use those variables

function WhichPanel(url) {
  *** Given a URL var like /myfeed, which which panel[0] this belongs to so I can get the other variables
  ** do something now that I have the settings above
}

function KillPanel(url) {
  *** Given a URL var like /myfeed, which which panel[0] this belongs to so I can get the other variables
  ** do something now that I have the settings above
}

Suggestions? thxs

Nick Craver · Accepted Answer · 2010-12-22 23:24:40Z

2

An object map would be easiest here, like this:

var panels = { "/myfeed": "#view-panel-myfeed", 
               "/otherurl": "#other-url-panel",
               "/otherurl2": ".other-url-panel2" }

Then in your functions you can just do panels[url] to get the selector that goes with it. If you need additional properties, just have objects instead for the values, like this:

var panels = { "/myfeed": { selector: "#view-panel-myfeed", other: "value" }, 
               "/otherurl": { selector: "#other-url-panel" },
               "/otherurl2": { selector: ".other-url-panel2" } }

Then to get the selector, it'd be panels[url].selector, .property for the other properties, etc.

answered Dec 22, 2010 at 23:24

Nick Craver

631k138 gold badges1.3k silver badges1.2k bronze badges

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

3 Comments

AnApprentice Over a year ago

interesting, is that pure JS or jQuery? Also, I have 3 panels, so would it be 3 blocks like you have above? And then once I have all 3+, how do I search given a URL, for which panel owns that URL?

Nick Craver Over a year ago

@AnApprentice - just one object map like I have above, with a key for each, the url being the key is the search...and it's basic JavaScript, no jQuery here :)

AnApprentice Over a year ago

very nice. One issue though is that if I'm using URL as the key, not all URLs are static. Some are variable. I have /myfeed, /item, /item/312, where 312 is a random number. I was doing something like else if (/\/items\/\d+/.test(url2load)) before is that possible with an object map?

sje397 · Accepted Answer · 2010-12-22 23:31:30Z

It becomes extremely difficult dealing with arrays that way; you have to remember what the indexes represent. It's much better to have an object with meaningful property names.

function SelectObj(id, clz) {
  this.id = id;
  this.clz = clz;
}

var objMap = {
  "/myfeed": new SelectObj('#view-panel-myfeed', 'XXXXXX'),
  "/otherurl": new SelectObj('#other-url-panel', null),
  "/otherurl2": new SelectObj(null, '.other-url-panel2')
}    

function WhichPanel(url) {
  var obj = objMap[url];
  // do something with obj.id and/or obj.clz  
}

function KillPanel(url) {
  var obj = objMap[url];
  // do something with obj.id and/or obj.clz  
}

Another advantage with this kind of approach is that you can add functions to your class, for example:

SelectObj.prototype.buldSelector = function() {
  var selector = '';
  if(this.id) selector += this.id;
  if(this.clz) selector += this.clz;
  return selector;
}

wazz3r · Accepted Answer · 2010-12-22 23:31:18Z

1

I would suggest using an object like this with JSON:

var panels = {
    '/myfeed': {
        selector: "#view-panel-myfeed",
        somevariable="XXXXXXXX"
    },
    '/otherurl': {
        selector: "#other-url-panel"
    },
    '/otherurl2': {
        selector: ".other-url-panel2"
    }
}

And then you ca get all the settings with:

function WhichPanel(url) {
    var settings = panels[url];
    alert(settings.selector);
}

WhichPanel('/myfeed'); //should alert "#view-panel-myfeed"

answered Dec 22, 2010 at 23:31

wazz3r

4724 silver badges15 bronze badges

Collectives™ on Stack Overflow

JS/jQuery - Advice on Creating a Variable that can be used in multiple functions

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related