each と swich
現在テトリスを作っています。難航しています。
今日は他の人のテトリスの記事を参考にしていましたが、全く持って理解できないコードだらけで、、、、精進します。
--- each()
配列を扱い、ループ処理を簡単に行ってくれるjqueryの記法
--- 特定のリストタグにcssをつけたい！
などどいうとときに活躍します。
<ul>
<li>リンゴ</li>
<li>メロン</li>
<li>バナナ</li>
</ul>
よく見かけるやつですね。
$('list').each(function(i, e){
if( (e).text === 'リンゴ'){
$(e).addClass("apple");
};
});
eachの第一因数はインデックス、第二因数はhtmlを返します。
--- switch
each()とは違い、javascriptのコード。こちらもループ処理を行ってくれますが、条件式と処理がよりわかりやすく明記されています。
--- キーボードのSpaceキーを押した時だけ処理を実行したい！
キーボード処理である document.onkeydown を利用すればこういうことができます。
document.onkeydown =(e)=>{
switch(e.code){
case "Space":
console.log("処理します！")
break;
case "ArrowRight":
console.log("処理します！")
break;
case "ArrowLeft":
console.log("処理します！")
draw();
break;
}
}
onkeydown はキーを押した瞬間に実行する処理のことです。
e.code で押したボタンの番号や文字を返します
switch("値")を case 値: で識別し、該当するときに処理を実行します。
--- まとめ・感想
実際にテトリスの記事コードを読むとこれらのようなループ文ばっかりでした。each文で一つ一つのセルを描画して、switchでボタンの処理をするという感じにみて取れました。どんどんアウトプットもして、より細やかな説明ができるよう努めます！！
