Question: I have an array of strings like so:

```
public ModeValue mode = new ModeValue("test_mode", "dog", new String[] {
        "cat", "dog", "rabbit", "horse", "bear", "fish", "bird", "snake"
}, this);

```

I would like to know how to treat each string as an integer. For example: cat = 1, dog = 2, rabbit = 3, etc. And then I would like to access each string by using that integer. This will be used in a list of string that can be clicked upon to have the modes switched.

Answer: 
You should bind context for `this` using `.bind(...)` or by supplying the context argument to `.map(...)`. Also make sure you supply a proper function as your event handler. In particular, wrap your handler in an arrow function to properly pass `index` upon event dispatch,

```
<div key={index} className="eachTrack" onClick={() => this.changeSong(index)}>

```
When using plain ES5 Javascript you need to explicitly bind `this` to a function. Fortunately, `Array.prototype.map` takes a second argument for the `this` context.

```
var listTemp = data.map(function(item,index) {

        return (
            <div key={index} className="eachTrack" onClick={this.changeSong({index})}>
                <span className="duration">{item.duration}</span>
                <a href="#" className="songTemplate" >{item.artist} - {item.track}</a>

            </div>  
        )
    }, this); // Passes in the parent `this` context to the map callback function

```