Trying to prepare HTML message from two arrays

I have two arrays as shown below:


var array1 = [
  "ABC012345",
  "DEF06789"
]

var array2 = [
  "BOX#9",
  "BOX#10"
]



let messageOne = "1.File "+array1[0]+" is located inside "+array2[0];

let messageTwo = "2.File "+array1[1]+" is located inside "+array2[1];

console.log(messageOne);

console.log(messageTwo);

And I want to prepare a HTML message such that I can display the two messages (messageOne and messageTwo one below another) that I shown above in a jQuery dialog. Here’s the JsFiddle of above code. How should I go about it? Is comibining two arrays going to add more ocmplexities or shall I keep it the way it is and think about it?

To respond in reverse order…

Depends on a few factors; the size of the arrays, the sources of the arrays, the potential for the arrays to become misaligned from each other, how many arrays you end up with…

Will it take more code to combine the arrays than leave them apart? Yes.
Does it save time in the future? Maybe.
Does it save brainpower in the future? Well if you’re going to call your arrays “array1”, “array2”, “array3” etc… probably, because when you’re 300 lines deep on your code, and you have to sit there and think “which array holds the file names again?”

Well, if it were me, i’d make objects if I had no option to modify how i got the data from the source.

let files = array1.map((value,index) => { return {'name': value, 'location': array2[index]}; }
...
files.forEach((file,index) => console.log((index+1) + ". File " + file.name + " is located inside " + file.location));
2 Likes