javascript - 使用 javascript 将单词数组与图像数组配对

Question

我正在制作一个 javascript 游戏，其中一个单词(9 个可能单词中的 1 个)会在屏幕上弹出并在几秒钟后消失。消失后，屏幕上会出现与可能出现的 9 个可能单词相对应的 9 个图像。我想将单词数组与图像数组链接起来，这样当出现单词时，您必须单击该单词对应的正确图像才能进入下一个级别。

如何连接两个阵列？

Answer 1

默认情况下，数组都使用基于 0 的索引来保存其值，因此，如果您的图片在图片数组中与其关联图像在图像数组中的位置相同，那么您应该能够使用以下命令访问它们相同的索引。

示例:

var wordArray = ["word1", "word2", "word3", "word4", "word5", "word6", "word7", "word8", "word9"];
var imageArray = ["image1", "image2", "image3", "image4", "image5", "image6", "image7", "image8", "image9"];

如果您像这样设置数组，那么您可以使用相同的索引来引用配对的单词/图片:

wordArray[0]  is 'word1'
imageArray[0] is 'image1'

wordArray[1]  is 'word2'
imageArray[1] is 'image2'

. . .

wordArray[8]  is 'word9'
imageArray[8] is 'image9'

<小时/>

或者，您可以使用包含单词/图片对的单个对象数组，而不是两个单独的数组。

var data = [
    {word: "word1",
     image: "image1"},
    {word: "word2",
     image: "image2"},

    . . .

    {word: "word9",
     image: "image9"}
];

如果您选择了这条路线，那么您将像这样引用配对的单词/图片:

data[0].word  is 'word1'
data[0].image is 'image1'

data[1].word  is 'word2'
data[1].image is 'image2'

. . .

data[8].word  is 'word9'
data[8].image is 'image9'