● STEP 10-3
クイズを表示しよう
難易度選択の保持
開始画面で選択した難易度に応じたクイズを表示する処理を実装します。
表示すべきクイズの内容はquizDataプロパティに入っています。改めて取得したJSONの構造を確認しておきましょう。
{
"level1": {
"step1": {
"word": "get",
"choices" : ["取得する", "与える", "追加する"],
"answer": "取得する"
},
"step2": {
"word": "add",
"choices" : ["除外する", "追加する", "反映する"],
"answer": "追加する"
},
"step3": {
"word": "remove",
"choices" : ["移動する", "整理する", "削除する"],
"answer": "削除する"
}
},
"level2": { ... },
"level3" { ... }
}
難易度を示すlevel1～level3のキーに対し、それぞれのバリューとしてクイズの内容が定義されています。step[番号]は設問番号を示します。
例えば上記のlevel1であれば、難易度が1で設問が3問あるクイズです。
それではクイズを表示するための処理を実装していきましょう。
クイズを表示する上で、開始画面で選択された難易度をクラス内で持っておく必要があります。ゲームのプレイ状況を集約するためのオブジェクト（gameStatus）をプロパティとして追加し（ ...
Get ステップアップJavaScript フロントエンド開発の初級から中級へ進むために now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
