之前，我們已經完成了題目的顯示與作答，如果你還沒看過，可以先了解一下：

手把手教你打造一個考試刷題系統(tǒng)（一）——界面結構搭建

手把手教你打造一個考試刷題系統(tǒng)（二）——界面動態(tài)加載顯示

手把手教你打造一個考試刷題系統(tǒng)（三）——倒計時組件

手把手教你打造一個考試刷題系統(tǒng)（四）——題目切換與標記狀態(tài)動作綁定

下面，我們來制作其中的最后一部分——得分計算。

PS：這部分，我們主要講其中的邏輯，而不是表現形式。

▌一、得分規(guī)則

首先，我們需要確定一套得分規(guī)則。比如：

●?單選或判斷題中，如果選錯，是否需要倒扣分？

●?在多選題和不定項中，如果錯選，是否可以得分？

●?在多選題中，只選擇了一個選項，是否能夠得分？

●?多選和不定項選擇題中，沒有錯誤選項，但未全對，所獲分數，是根據答案的選項數來還是固定的數？

而根據一般的規(guī)則，我做出了如下的得分情況：

接下來，我們根據題型具體來看。

▌二、單選與判斷

我們從簡單的來說，首先是單選和判斷，因為考生答案只有完全正確和完全錯誤兩種狀態(tài)。

我們只需要將考生回答與參考答案對比，如果完全一致，則得分，否則不得分或倒扣分（即得 0 分或 -0.5 分）。

以判斷題為例：

▌三、多選與不定項有錯誤選項

接下來，我們討論一下多選題和不定項的得分。

首先，我們需要判斷，如果有錯誤選項，直接得零分，否則再做其他處理。那么，如何判斷回答是否有錯誤答案呢？

首先，考生答案不能為空（我們的默認值），用代碼表示即為：

當上面的條件不成立后，我們只需要對比，參考答案與考生答案中同位置的字母是否為空即可：

▌四、多選與不定項無錯誤選項

接下來，考生的答案中，就沒有錯誤選項了。只需要根據規(guī)則，計算得分即可。

先說多選題，按照答案的個數，比如答案是 ABCDE，而回答為 AB，則得分為 2 / 5 * 4。

那么，怎樣計算答案和答題中的選項個數呢？用循環(huán)嗎？

提供一個小技巧，先將所有的空字符"_"去除，然后統(tǒng)計字符數就可以了。

簡單解釋一下：?str.replace(/_/g,"")表示將所有的_替換為空?/g表示全部替換，如果沒有該參數，只能將A_C_D替換為AC_D，不能替換為ACD。

有了這個思路，不定項的得分也能輕松算出：

▌五、總分統(tǒng)計

最后，我們只需要將每道題的得分加在一起就可以啦。

這里注意，在 JS 中，你可能會看到 0.5 - 0.4 = 0.9999999998 這種奇怪的現象，這個與計算機的二進制計算有關，不做過多解釋。

但為更好的顯示，我們可以僅保留兩位小數，使用 num.toFIxed(2) 即可：

有了上面的操作步驟后，你就可以得到下面這樣的反饋信息了：

當然，這個頁面不是特別好看，你可以把上面的答案用 table 表格的方式加載到頁面里，這里就不多介紹了。

▌六、一點小修正

在實際測試中，切換題目時，會出現左側答題卡中標記為綠色（已作答），而右側選項中選項中卻沒有打勾的奇怪現象：

這是因為我們刷新時，各個選項元素都會重新加載，而 input 默認是不勾選（ checked ）的，因此，我們在刷新時，需要從 subject 中讀取之前的答案，并據此加載 input 的 checked 屬性：

▌最后

至此，我們的考試刷題系統(tǒng)就告一段落了。

如果你也對里面的完整代碼、邏輯感興趣，可以訪問：

源代碼：https://gitee.com/mo-qianbei/examination-system/

語雀文檔：https://www.yuque.com/moqianbei/shuati

但這個系統(tǒng)還不是特別完善，至少還有如下的功能細節(jié)可以優(yōu)化：

• 是否可以選擇隱藏題目的解析；

• 計算得分時是否可以重新作答；

• 是否可以根據題目數量確定每題的分值，而不是固定的4分；

• 計算器功能還未實現；
  ……

這些，就等待緣分啦，下次見~