JavaScript: indexOf in Associative/Object array?

Question

I have this array:

var skins = {};
skins.w = "http://example.com/public/images/char_elements/base.png";

var eyes = {};
eyes.b = "http://example.com/public/images/char_elements/eyes/blue.png";
eyes.g = "http://example.com/public/images/char_elements/eyes/green.png";
eyes.r = "http://example.com/public/images/char_elements/eyes/red.png";

var hair = {};
hair.b = "http://example.com/public/images/char_elements/hair/black.png";
hair.w = "http://example.com/public/images/char_elements/hair/blond.png";
hair.s = "http://example.com/public/images/char_elements/hair/brown.png";

var mouth = {};
mouth.h = "http://example.com/public/images/char_elements/mouth/happy.png";

var pants = {};
pants.s = "http://example.com/public/images/char_elements/pants/shorts.png";

var shoes = {};
shoes.b = "http://example.com/public/images/char_elements/shoes/black.png";

var torso = {};
torso.s = "http://example.com/public/images/char_elements/torso/shirt.png";

And this function:

function SwitchElement(type){
switch(type){

    case "eyes":
    var cur = eyes.indexOf(document.getElementById(type).src);
    console.log(cur);
//  var eyesId = document.getElementById("
    break;
}
}

And all this is called by:

<img class="builder_control_front" src="http://claro.mib.infn.it/arrow.png" onclick="SwitchElement('eyes');"/>

So basically when user clicks on arrow, it calls javascript function which gets current image loaded, get's index of array where element is located (in this case array: "eyes") and cycle through it.

I need to get index by url, when I try to use indexOf it throws Undefined, I read that JavaScript will convert array to Object if array has named indexes.

So chow can I get index of current loaded image?

Note: I NEED to have array with codes like: b, g, r, w, w4, b3 etc.. so Changing to normal array is not quite an option, perhaps changing to multidimensional array would be better?

you'd probably want to loop through the eyes like stackoverflow.com/questions/19969751/… and do something like for( var i in eyes ) { if (eyes[i] == document.getElementById(type).src) { cur = i; break; } } or something like that — Dave Goten
– Dave Goten, Commented Feb 20, 2015 at 21:03
" I read that JavaScript will convert array to Object if array has named indexes." Arrays are objects. They can have named properties, but only the numerical indices correspond to the array elements. — JLRishe
– JLRishe, Commented Feb 20, 2015 at 21:08

tymeJV · Accepted Answer · 2015-02-20 21:04:32Z

0

Why not just iterate your object and find the key containing the value:

function findKey(obj, value) {
    for (var key in obj) {
        if (obj[key] == value) return key
    }
    return null;
}

var key = findKey(eyes, document.getElementById(type).src);
if (key != null) { 

} else {

}

answered Feb 20, 2015 at 21:04

tymeJV

105k14 gold badges165 silver badges158 bronze badges

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

Comments

JLRishe · Accepted Answer · 2015-02-20 21:04:51Z

What you need is a reverse lookup. Assuming that all of your URLs are unique, you can create one like this:

function invert(obj) {
    var newObj = {};
    for(var key in obj) {
        if (obj.hasOwnProperty(key)) {
            newObj[obj[key]] = key;
        }
    }
}

var hair = {};
hair.b = "http://example.com/public/images/char_elements/hair/black.png";
hair.w = "http://example.com/public/images/char_elements/hair/blond.png";
hair.s = "http://example.com/public/images/char_elements/hair/brown.png";
var hairReverse = invert(hair);

var url = "http://example.com/public/images/char_elements/hair/black.png";
console.log(hairReverse[url]); // logs "b"

If you're using Lodash/Underscore, it has an invert function built in:

var hairReverse = _.invert(hair);

Collectives™ on Stack Overflow

JavaScript: indexOf in Associative/Object array?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related