7.3.3 编写游戏循环

  游戏循环的框架如下所示:

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

  我们使用while循环,它会一直查看remainingLetters>0是否为true。每次玩家做出了正确的猜测,循环体都会修改remainingLetters。如果玩家猜中所有字母,remainingLetters将变为0并且循环结束。

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

  后面的小节将会说明组成游戏循环的主体代码。

展示玩家的进度

  在游戏循环内部,首先需要做的事就是展示玩家的当前进度:

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

  用join方法把answerArray数组连接成一个字符串,用空格字符作为分隔符,并且为alert方法把这个字符串展示给玩家。例如,假设这个单词是monkey,玩家猜到了m、n和e。answerArray数组应该是[“m” ,””o” ,”_” ,”_” ,”e”,”_”],answerArray.join(“”)将会得到”m o _ _ e _”。

Alert对话框如图7-4所示。

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

    图7-4 用alert对话框展示玩家的进度

处理玩家的输入

  现在,需要从玩家那里得到他所猜测的字母,并且确保它是单个的字符。

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

  在❶处,prompt方法从玩家那里得到了猜测的内容,并且把它保存到变量guess中。此时,会发生4种情况之一:

  首先,如果玩家单击了Cancel按钮,那么猜测内容为null。在❷处,查看条件if(guess===null)。如果条件是true,使用break退出循环。

注意 无论程序处在循环中的哪个位置,也不管while条件当前是否为真,都可以在任意循环语句中使用关键字break来立即终止循环。

  第2种和第3种可能性是玩家什么也不输入或者输入了太多的字母。如果他们什么也不输入就单击OK按钮,猜测内容就是空的字符串””。在这种情况下,guess.length会是0.如果他们输入的内容多于1个字母,guess.length会大于1.

  在❸处,使用else if  (guess.length !==1)来检查这些条件,以确保猜测内容是一个字母。如果不是,显示一条警示信息:“Plaese enter a single letter.”

  第4种可能性是玩家输入了一个有效的字母。然后,我们必须根据他们猜测的字母来修改游戏的状态,在❹处使用else语句,这里所要做的事情将在下一节介绍。

更新游戏的状态

  一旦玩家输入有效的字母,必须根据猜测来修改answerArray数组。为了做到这点,在else语句中添加了如下代码:

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

  在❶处,使用新的名为j的循环变量创建了一个for循环,j从0到word.length(在这个循环中,使用j作为变量,因为在前面的for循环中已经使用过i)。使用这个循环遍历单词中的每个字母。例如,假设单词是pancake。循环的第1轮,j等于0,word[j]是”p”。第2轮,word[j]是”a”,然后是”n”、”c”、”a”、”k”和最后的”e”。

  在❷处,使用if( word [j] ===guess)来检查当前的字母是否与玩家猜测的字母一致。如果一致,使用answerArray[j]=guess以当前的guess来更新answerArray。对于单词中与所猜测的字母相匹配的每一个字母,我们都会在相应的位置更新answerArray。之所以可以这么做,是因为循环变量j可以用来作answerArray的索引,就像可以把它用作单词的索引一样,如图7-5所示。

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

    图7-5 单词和answerArray数组可以使用相同的索引

  例如,假设刚开始玩这个游戏,现在到达了❶处的for循环。假设这个单词是”pancake”,猜测的字母是”a”, answerArray数组现在看上去如下所示:

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

  在❶处,for循环的第1轮循环中,j是0,所以word[j]是”p”。猜的字母是”a”,所以在❷处跳过这条if语句(因为”p”===”a”是false)。在第2轮循环中,j是1,所以word[j]是”a”。这次猜对了,所以进入这条语句的if部分。answerArray[j]=guess;这一行,将answerArray的索引设置为1(第2个元素),所以answerArray现在看上去如下所示:

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

  在接下来的两轮循环中,word[j]是”n”和”c”,它们都与猜测的字母不一致。然而,当j等于4时,word[j]又是”a”。又一次修改了answerArray,这次把索引为4的元素(第5个元素)设置为猜测的字母,现在,answerArray看上去如下所示:

《avascript-少儿编程》第七章-编写游戏代码(编写游戏循环)

  单词中剩下的字母都和”a”不一致,所以最后两轮的循环中没什么事情发生。在这次循环的最后,会把单词中所有猜对的字母都更新到answerArray中。

  每猜对一次,除了修改answerArray,还需要将remainingLetters减1。在❸处,使用remainingLetters--;语句做到这一点。每次猜对单词中的字母,remainingLetters都会减1.一旦玩家猜对了所有字母,remainingLetters将变为0。