javascript - 如何在循环内创建具有唯一变量名称的动态对象？

Question

我正在尝试以编程方式在JS中创建4个不同的音频对象。我在此线程中看到了与此类似的线程:"How do I create dynamic variable names inside a loop?"
但是，变量名的更改会在循环阶段利用。尽管我不确定如何在循环中以编程方式使用该关键字，但在线程内部也有使用this关键字的答案。
尝试:

var buttonColours = ["red", "blue", "green", "yellow"]
var sounds = [];

for (var i=0; i < buttonColours.length; i++) {
  sounds[i] = new Audio(`sounds/${buttonColours[i]}.mp3`); // Eg. name of audio file - 'blue.mp3'
}

console.log(sounds);

电流输出:

 [audio, audio, audio, audio]

所需的输出(每个存储一个不同的音频对象，因为它们播放不同的声音):

 [redSound, blueSound, greenSound, yellowSound]

Answer 1

与其将音频对象存储在数组中，不如使用对象。为了使用它们，您可以使用Object.keys(sounds)遍历对象的键

var buttonColours = ["red", "blue", "green", "yellow"]
var sounds = {};

for (var i=0; i < buttonColours.length; i++) {
  sounds[buttonColours[i]+"Sound"] = new Audio(`sounds/${buttonColours[i]}.mp3`); // Eg. name of audio file - 'blue.mp3'
}

console.log(sounds);
//{redSound: audio, blueSound: audio, greenSound: audio, yellowSound: audio}