How can I access the current index of an array element when using the `for of` JavaScript loop syntax?

In my last frontend project, numbering dropdown items dynamically was key.

Looping back (pun intended :smile:), I used the .entries() method with a twist—adjusting the index for more human-friendly display:

const fruits = ['apple', 'banana', 'cherry'];
for (let [i, fruit] of fruits.entries()) {
  console.log(`${i + 1}: ${fruit}`);
}

Using this with for of JavaScript index not only kept my dropdown clean but also made the numbering user-readable, without any extra library. Destructuring here just feels built-in once you get used to it.