Javascript array indexed by string

Question

I have the below javascript function I want to optimise for my web app.

function DisplayToolTip(str) {
  switch (str) {
    case "a": 
        this.tooltip(xvalue,yvalue,text);
        break;
    case "b": 
        this.tooltip(xvalue,yvalue,text);
        break;
    case "c": 
        this.tooltip(xvalue,yvalue,text);
        break;
    default: break;
  }
}

The switch statement may change i.e. json may need to add in a case "d" but the function exists so dont know how to update the above.

Normally in c# I would use a dictionary, so key would be "a" and value would be an object with properties xvalue,yvalue,text or value would be a string "this.tooltip(xvalue,yvalue,text);". This way I could update the dictionary and the execution speed of 'DisplayToolTip' would be relatively the same no matter how many elements.

How do you create an array of objects indexed or quickly found using a string value in javascript?

Sorry, but I'm not sure what the question is asking. Could you clarify please? — Qantas 94 Heavy
– Qantas 94 Heavy, Commented Oct 26, 2013 at 9:11
Note that in Javascript the default case is not necessary. — Qantas 94 Heavy
– Qantas 94 Heavy, Commented Oct 26, 2013 at 9:15
the current function is created with the actual values so this.tooltip(1,2,"tooltip"); but was thinking of moving to objects client side possibly — Dere_2929
– Dere_2929, Commented Oct 26, 2013 at 9:18

Peter Rasmussen · Accepted Answer · 2013-10-26 09:25:10Z

2

Objects in javascript are like dictionaries.

var dictionary = {
    a : ["xvalue","yvalue","text1"],
    b : ["xvalue","yvalue","text2"]
}

console.log(dictionary["b"][2]); // will give you text2.

Demo

EDIT: Updated answer to contain arrays (as that is what the question is).

edited Oct 26, 2013 at 9:25

answered Oct 26, 2013 at 9:15

Peter Rasmussen

17k8 gold badges50 silver badges64 bronze badges

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

1 Comment

Delan Azabani Over a year ago

If keys are dynamically being inserted from external sources, adding a prefix may be helpful to avoid conflicts with members defined in all objects such as toString and hasOwnProperty.

MaxArt · Accepted Answer · 2013-10-26 09:15:25Z

0

You can use the switch statement itself, with fall-through:

switch (str) {
    case "a": case "b": case "c": 
        this.tooltip(xvalue,yvalue,text);
        break;
    default: break;
}

(But, as Qantas commented, the default case isn't necessary here.)

Or, it the browser supports it, you can use the indexOf method of arrays:

if (["a", "b", "c"].indexOf(str)) ...

edited Oct 26, 2013 at 9:15

answered Oct 26, 2013 at 9:14

MaxArt

22.8k10 gold badges85 silver badges82 bronze badges

3 Comments

Dere_2929 Over a year ago

The function already exists and because of user selection need to add in case "b" through JSON as dont want to redraw whole page.

MaxArt Over a year ago

@Dere_2929 Ok, where's this JSON then? Is there a variable or something?

Dere_2929 Over a year ago

JSON runs after user clicks button, think peter/poelinca/ruslan implementation will work with json result to update dictionary

Ruslan Polutsygan · Accepted Answer · 2013-10-26 09:19:45Z

0

I would do something like this:

var tooltipSettings={
    a: {xvalue: 1, yvalue: 1, text: 'string a'},
    b: {xvalue: 2, yvalue: 2, text: 'string b'},
    c: {xvalue: 3, yvalue: 3, text: 'string c'}
};

function DisplayToolTip(str) {
    if(tooltipSettings[str])
    {
        var settings=tooltipSettings[str];
        this.tooltip(settings.xvalue, settings.yvalue, settings.text);
    }
}

answered Oct 26, 2013 at 9:19

Ruslan Polutsygan

4,4612 gold badges28 silver badges38 bronze badges

1 Comment

Dere_2929 Over a year ago

thanks for this as may use for object implementation

Poelinca Dorin · Accepted Answer · 2013-10-26 09:27:34Z

0

You could use a dictionary, witch is basically an plain object. Javascript allows you to access an object property by string like you would access an array property like this:

var obj = {
    test: 'text',
    b: 4
}
console.log(obj['test'], obj.test);
console.log(obj['b'], obj.b);

So your code would look like this:

var pairs = {
    'a': {
        xvalue: 1,
        yvalue: 1,
        text: '1111'
    },
    'b': {
        xvalue: 2,
        yvalue: 2,
        text: '2222'
    }
};
function DisplayToolTip(str) {

    var prop = pairs[str];

    if (typeof prop !== 'undefined')
        return this.tooltip(prop.xvalue, prop.yvalue, prop.text);

    throw 'undefined prop ' + str;
}

edited Oct 26, 2013 at 9:27

answered Oct 26, 2013 at 9:17

Poelinca Dorin

9,7052 gold badges41 silver badges43 bronze badges

1 Comment

Dere_2929 Over a year ago

thanks for this as may use for object implementation

Collectives™ on Stack Overflow

Javascript array indexed by string

4 Answers 4

1 Comment

3 Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

3 Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related