How do I reference the string in a array of strings?

Question

I have the following:

var tags = ["Favorite", "Starred", "High Rated"];

for (var tag in tags) {
    console.log(tag);
}

Output is

0
1
2

I'd like it to output:

Favorite
Starred
High Rated

How do I do this? Thanks.

Answer 1

Itearting over an array:

That's an array of strings, don't use for..in, use the vanilla for loop:

var tags = ["Favorite", "Starred", "High Rated"];
for (var i = 0; i < tags.length; i++) { // proper way to iterate an array
    console.log(tags[i]);
}

Output:

Favorite
Starred
High Rated

Proper usage of for..in:

It is meant for object's properties, like:

var tags2 = {"Favorite": "some", "Starred": "stuff", "High Rated": "here"};
for (var tag in tags2) { // enumerating objects properties
    console.log("My property: " + tag +"'s value is " +tags2[tag]);
}

Output:

My property: Favorite's value is some
My property: Starred's value is stuff
My property: High Rated's value is here

Side effects of for..in with arrays:

Don't take my word for it, let's see why not use it: for..in in arrays can have side effects. Take a look:

var tags3 = ["Favorite", "Starred", "High Rated"];
tags3.gotcha = 'GOTCHA!'; // not an item of the array

// they can be set globally too, affecting all arrays without you noticing:
Array.prototype.otherGotcha = "GLOBAL!";

for (var tag in tags3) {
    console.log("Side effect: "+ tags3[tag]);
}

Output:

Side effect: Favorite
Side effect: Starred
Side effect: High
Side effect: GOTCHA!
Side effect: GLOBAL!

See a demo fiddle for these codes.

Answer 2

Using in in for loops in JavaScript is not like : in Java or foreach in other languages - instead of providing reference to the element, it provides its index. If you use a framework like jQuery, there is a method - $.each which gives access to the element (not only the index) via callback when iterating:

var a = ["Favorite", "Starred", "High Rated"];
$.each ( a, function ( index, data ) 
{
   console.log ( data );
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>