I want to give each of my array element a number

Question

I have this code, a problem with is that it lists numbers for individual array elements instead of a whole array.

I did try other methods including .map but I failed.

let names = 'Bilbo, Gandalf, Nazgul, Bob, Grim, Laniakea, Dzevid, Levan, George, What';

let arr = names.split(', ');

for (let name of arr) {
for(let i =1; i < arr.length; i++)
  document.write( i + ` A message to ${name}.` + `<br>` ); // A message to Bilbo  (and other names)

}

1. My results with this code is this:

    1 A message to Bilbo. 2 A message to Bilbo. 3 A message to Bilbo. 4 A message to Bilbo. 5 A message to Bilbo. 6 A message to Bilbo. 7 A message to Bilbo. 8 A message to Bilbo. 9 A message to Bilbo. 1 A message to Gandalf. 2 A message to Gandalf. 3 A message to Gandalf. 4 A message to Gandalf. 5 A message to Gandalf. 6 A message to Gandalf. 7 A message to Gandalf. 8 A message to Gandalf. 9 A message to Gandalf. 1 A message to Nazgul. 2 A message to Nazgul. 3 A message to Nazgul. 4 A message to Nazgul. 5 A message to Nazgul. 6 A message to Nazgul. 7 A message to Nazgul. 8 A message to Nazgul. 9 A message to Nazgul. 1 A message to Bob. 2 A message to Bob. 3 A message to Bob. 4 A message to Bob. 5 A message to Bob. 6 A message to Bob. 7 A message to Bob. 8 A message to Bob. 9 A message to Bob. 1 A message to Grim. 2 A message to Grim. 3 A message to Grim. 4 A message to Grim. 5 A message to Grim. 6 A message to Grim. 7 A message to Grim. 8 A message to Grim. 9 A message to Grim. 1 A message to Laniakea. 2 A message to Laniakea. 3 A message to Laniakea. 4 A message to Laniakea. 5 A message to Laniakea. 6 A message to Laniakea. 7 A message to Laniakea. 8 A message to Laniakea. 9 A message to Laniakea. 1 A message to Dzevid. 2 A message to Dzevid. 3 A message to Dzevid. 4 A message to Dzevid. 5 A message to Dzevid. 6 A message to Dzevid. 7 A message to Dzevid. 8 A message to Dzevid. 9 A message to Dzevid. 1 A message to Levan. 2 A message to Levan. 3 A message to Levan. 4 A message to Levan. 5 A message to Levan. 6 A message to Levan. 7 A message to Levan. 8 A message to Levan. 9 A message to Levan. 1 A message to George. 2 A message to George. 3 A message to George. 4 A message to George. 5 A message to George. 6 A message to George. 7 A message to George. 8 A message to George. 9 A message to George. 1 A message to What. 2 A message to What. 3 A message to What. 4 A message to What. 5 A message to What. 6 A message to What. 7 A message to What. 8 A message to What. 9 A message to What. 

I want it to work in the following way:

    1 A message to Bilbo
    2 A message to Gandalf
    3 A message to Nazgul
    4 A message to Bob
    5 A message to Grim
    6 A message to Laniakea
    7 A message to Dzevid
    8 A message to Levan
    9 A message to George
    10 A message to what

Answer 1

Not sure what you are trying to achieve. But here is the code which can help.

let names = 'Bilbo, Gandalf, Nazgul, Bob, Grim, Laniakea, Dzevid, Levan, George, What';\
names = names.split(',');

names.forEach((name, index) => {
    document.write(`${index} A message to ${name.trim()}`);
})

In this example we firstly transform that long string into array of names. Then using simple forEach handle each name. Note that I use name.trim() for removing unnecessary spaces left after splitting.

Answer 2

Actually there was no need to add for (let name of arr) { .... } . You can just remove that line. Other than that, you need to start for loop from i = 0 , as an array starts from index 0 ,

let names = 'Bilbo, Gandalf, Nazgul, Bob, Grim, Laniakea, Dzevid, Levan, George, What';
let arr = names.split(', '); 

for(let i = 0; i < arr.length; i++){
  document.write( `${i+1}`  + ` A message to ${arr[i]}.` + `<br>` );
}

Answer 3

Why do you use a second loop ? just set a counter like

let names = 'Bilbo, Gandalf, Nazgul, Bob, Grim, Laniakea, Dzevid, Levan, George, What';

let arr = names.split(', ');
let count = 1;
for (let name of arr) {
 document.write( count + ` A message to ${name}.` + `<br>` );
 count++;
}

Or

for (i = 1; i < arr.length; i++) { 
    document.write( i + ` A message to ${name}.` + `<br>` );
}

Answer 4

You can use the map for looping and you do not need second loop because arr is one-dimensional array

 let names = 'Bilbo, Gandalf, Nazgul, Bob, Grim, Laniakea, Dzevid, Levan, George, What'; let arr = names.split(', '); arr.map((d, i)=>{ document.write( i+1 + ` A message to ${d}.` + `<br>` ); // A message to Bilbo (and other names) })