javascript（テトリス002_揃った行を消す）

■ピースが揃った場合の処理を追加する。
今は１マス分のみのピースが落ちる形で作っている。左上から、各オブジェクトに0～199の番号を付けており、それに対応する形の配列（board）を用意して０（ピースがない状態）、１（置かれた状態）としている。そのため、一番下の１行が揃う場合、オブジェクトや配列の番号の190～199がそれぞれ１となる。

この判定を行うコードを下のように作った。

function deleteSetLine() {
         let deleted = [];
         for (let i=0; i<20; i++) {
         let flag = 0;
             for (let j=0; j<10; j++) {
                 if (board[i*10+j] === 0) {
                      break;
                 } else {
                      flag++;
                 }
             }
             if (flag === 10) {
                 deleted.push(i);
             }
         console.log("aaaa:"+flag);
         }


         if (deleted.length > 0) {
             for (const start_line of deleted) {
                 board.splice(start_line*10, 10);
                 board.unshift(0,0,0,0,0,0,0,0,0,0);
                 for (let i=0; i<200; i++) {
                    if(board[i]===0) {
                       let temp = i;
                       $('.squ' +temp).css('background-color', 'White');
                    } else{
                       let temp = i;
                       $('.squ' +temp).css('background-color', 'Green');
                    }
                 }
                 deleted=[];
             }
         }
}

ここで、１行がすべて揃った行の左端の番号を push で配列に追加し、その後、そこを起点とした10の要素を splice で削除し、unshift で先頭から新規に置かれていない状態の数値（0）を追加する。これでまず board を更新し、それに同期させるようオブジェクト全体の色を更新する。全体を下にずらす形にしなければならないので、200のオブジェクトへの処理は避けられないと思う。

実行結果が下。適当に作ったピースの積み重ね（緑色の部分）の隙間に赤いピースを入れ１行が揃う。

一番下の１行が消えて全体が下にずれる。

1マスのピースだけ動かしているので、複数行を同時に消す確認はできないけど、ロジック的には複数でも問題ないはず。2マス分、3マス分のピースの組み合わせは下のような感じ。ピースの回転とか考えると3マス分で見た方が良さそうなので、次は3マス分に拡張して課題とか考えてみる。