【週刊ドットインストール】 考える力を養うための新クラス『データで学ぶアルゴリズム』を256timesでリリース!
お世話になっております。 確かに、今回は以下の関数で forEachの中でaddEventListenerが指定されており、 解釈が難しいです。
forEach
addEventListener
function setQuiz(){ isAnswered = false; question.textContent = quizSet[currentNum].q; const shuffledChoices = shuffle([...quizSet[currentNum].c]); shuffledChoices.forEach((choice)=>{ const li = document.createElement('li'); li.textContent = choice; li.addEventListener('click',() => { checkAnswer(li); }); choices.appendChild(li); }); }
これは、最終行の setQuiz();が実行された時点では、li.addEventListenerでは checkAnswer(li); という関数が指定されただけと考えて良いのでしょうか?
setQuiz();
li.addEventListener
checkAnswer(li);
そして、最初のクリックが起きた時点で実行される checkAnswer(li); で isAnsweredという変数が falseに変化する。 二度目のクリックでも checkAnswer(li); は実行されるけど、以下の21行目の isAnswered = true; 以降は実行されない。このような解釈で良いでしょうか?
isAnswered
false
isAnswered = true;
function checkAnswer(li){ if(isAnswered){ return; } isAnswered = true; if(li.textContent === quizSet[currentNum].c[0]){ li.classList.add('correct'); }else { li.classList.add('wrong'); } }
ドットインストールは、3分動画でマスターできるプログラミング学習サービスです。
3分で気軽に学習でき、スマートフォンからも視聴可能です。ホームページやWebサービスの制作を通して、実践的にプログラミングを学べます。
他にも、ゲーム制作やデータ分析・機械学習・AIに使われる言語まで幅広くカバー。学びたい分野のレッスンがきっと見つかります。
この回答を見るにはプレミアムプランへの登録が必要です
お世話になっております。
確かに、今回は以下の関数で
forEachの中でaddEventListenerが指定されており、解釈が難しいです。
これは、最終行の
setQuiz();が実行された時点では、li.addEventListenerではcheckAnswer(li);という関数が指定されただけと考えて良いのでしょうか?そして、最初のクリックが起きた時点で実行される
checkAnswer(li);でisAnsweredという変数がfalseに変化する。二度目のクリックでも
checkAnswer(li);は実行されるけど、以下の21行目のisAnswered = true;以降は実行されない。このような解釈で良いでしょうか?