---
# System prepended metadata

title: Day 16 阿嬤的猜字遊戲！（上）

---

# Day 16 阿嬤的猜字遊戲！（上）

Hangman 是一個猜字遊戲，讓主持人挑選一個單字，讓各位玩家盡情的猜。
例如：我們的主持人抽到了一個單字！Macular degeneration（黃斑病變）
不要問我為什麼要挑高難度的語詞：）第一位玩家可能會這樣寫：
```
M _ _ _ _ _ r  d e g _ _ _ _ _ _ _ _ _  
```
猜字的玩家會試著猜這個單字裡的字母。每猜對一個，就可以獲得 1 分，
他填了5個字母，他就可以獲得5分，反之，若他答錯了3個字母，他就會被扣 3 分，因為
錯一題扣一分：
```
M a n _ _ _ r  d e g e n a _ _ t _ _ _
```
在這次猜字遊戲中，我們要讓 JavaScript 當我們的主持人，他會挑一個單詞
，玩家們就會猜字母，以上就是簡略概要，只是希望可以再次透過這段文字來解釋規則，當然，
開發一個猜字遊戲也不是簡簡單單就能做出來的事，所以一樣會分上中下章，而且會引用到以前
學的`prompt`、`confirm`、`alert`等函數與各種程式碼，接下來都會一一位大家複習，那，準備好了嗎？
這篇的重點要來嘍。

## 彈窗

問答題必須要用到彈窗阿！

prompt = 

![](https://i.imgur.com/M6OzXDU.png)

![](https://i.imgur.com/rhWtPlV.png)

confirm =

![](https://i.imgur.com/59RGJHd.png)

![](https://i.imgur.com/uIUuZv7.png)

alert =

![](https://i.imgur.com/baE89NK.png)


![](https://i.imgur.com/jWDCZEh.png)


okok 你們都很聰明滴～

## 設計遊戲

在撰寫 Hangman 遊戲前，可以先想一下這個遊戲的一些難題：

*1. 怎麼讓 JavaScript 挑選一個單詞？
2. 怎麼接收玩家猜的字母？
3. 可以中途退出遊戲嗎？
4. 要怎麼判斷猜的字母正確？
5. 怎麼紀錄玩家猜對的字母並告訴玩家？
6. 怎麼結束遊戲？*

除了第一個任務和最後一個任務，其他的都必須重複多次
所以我們需要`While`迴圈或是`For`迴圈（自己去複習阿我就不一一介紹了）

### 紀錄單字的狀態

對於 Hangman 遊戲，這意味著要參賽者填入正確的字母，還要先展示這個神秘的單詞中，
有哪些空白，當然不可能一開始就給你看這個單詞怎麼拼，那還玩什麼？攤牌啦。

要怎麼做呢？只要當參賽者猜對了這個字母，填入它們即可。但嘴上說著很簡單，實際做起來，
難到連親媽都不認識：）（應該沒那麼難喔啾咪不要亂講）
在遊戲中，我們創建一個新的陣列，用來存放此單字的字母，簡單來講，就好像你買了個空罐子，
用來裝草莓果醬一樣的道理。把這個陣列命名為「單字」若參賽者猜的字母正確，
我們就把猜對的字母放到對應的空格，然後我們把 " _ " 當作空格。

我們把陣列當成一個空罐子好了。假如：我們買來的罐子原本是空的嘛，但是因為草莓果醬，
填滿了這個罐子，換句話說，當草莓果醬填滿了一整個罐子時，我們就知道這個參賽者獲勝了
因為我們用草莓果醬來比喻字母。

### 迴圈

主要遊戲的過程都繞著 While 迴圈轉（ㄟ等等，我們繞著迴圈轉？）在這個循環中，
顯示單字的狀態是在猜測之中；要求玩家進行一次猜測。

幾乎所有的電腦遊戲都是繞著某種循環（我們繞著循環轉？？？），只是循環的快慢而已，
這些循環跟 Hangman 遊戲大大的關係，大部分的遊戲循環都這樣做：

*1. 接收玩家的輸入
2. 修改遊戲狀態
3. 把狀態顯示給玩家*

控制台接收玩家輸入的字母，如果猜對了，就會更改此數組的狀態，並且告訴玩家。

若玩家完美猜出整個單字的話，控制台就會輸出完整的單詞，並且跳出一整個祝賀信息給玩家。

# 小總結

今天我們知道了猜字遊戲的概要和製作大綱與結構
，然後我也是第一次做，有錯可以指正一下謝謝～
下一章我們會講怎麼編寫此遊戲的程式碼，那就敬請期待吧！下回再見嘍掰掰！～





























