JS 러시아 블록 완벽 주석 코드

R /**JS 러시아 사각형 의 완벽 한 주석 판 v 1.01*c 언어 를 배 울 때 부터 러시아 사각형 을 쓰 고 싶 었 지만 손 을 움 직 일 때마다 너무 어 려 웠 습 니 다.*오늘 드디어 4 시간 정도 걸 려 서 썼 습 니 다.그 중에서 사각형 변형 에 대해 서 는*친구 에 게 문의 하기 도 했 습 니 다.**개인 적 으로 어 려 운 점 은 이렇게 몇 가지 가 있다 고 생각 합 니 다.*1:경계 검 사 는 더 이상 말 하지 않 고 납득 하면 됩 니 다.*2:회전 입 니까?아니면 수학 적 인 방법 입 니까?한 점 이 다른 점 에 비해 90 도 회전 하 는 문제 입 니 다.*4:전체 프로그램 이 시 작 된 후에 어떻게 자동 으로 작 동 하 게 합 니까?저 는 예전 에 끝내 지 못 했 습 니 다.*어떤 메커니즘 으로 게임 을 자동 으로 실행 시 켜 야 할 지 잘 모 르 기 때 문 입 니 다.*이 과정 은 이렇게 이해 할 수 있 습 니 다.*사용자 점 시작->활동 도형 을 만 들 고 타 이 머 를 설정 합 니 다.*아래로 이동 할 때마다 바닥 에 닿 았 는 지 확인 합 니 다.바닥 에 닿 았 으 면 줄 을 없 애 려 고 합 니 다.*끝 난 후에 활동 도형 을 만 듭 니 다.타이머 설정.*//페이지 의 table 을 표시 합 니 다.이 table 은 게임 의 메 인 패 널 var tbl 을 표시 합 니 다.//게임 상태 0:시작 하지 않 음;1.실행 하기;2 중지;var status = 0; //타이머,타이머 에서 moveDown 동작 var timer;/점수 var score=0;/board 는 18*10 의 배열 로 페이지 의 table 과 대응 합 니 다.//그 격자 들 이 이미 차지 하고 있 음 을 표시 합 니 다.초기 에는 0 이 었 으 며,차지 하면 1 var board=new Array(18)입 니 다.for(var i=0;i<18;i++){ board[i] = new Array(10); } for(var i=0;i<18;i++){ for(var j=0; j<10; j++){ board[i][j] = 0; } } //현재 활성 화 된 사각형 은 좌우 로 이동 하고 변형 할 수 있 습 니 다.바닥 에 닿 으 면 board 를 업데이트 합 니 다.var activeBlock; //사각형 모양 을 생산 합 니 다.7 가지 기본 모양 이 있 습 니 다.function generateBlock(){activeBlock=null;activeBlock = new Array(4); //generate a random int number between 0-6; var t = (Math.floor(Math.random()*20)+1)%7; switch(t){ case 0:{ activeBlock[0] = {x:0, y:4}; activeBlock[1] = {x:1, y:4}; activeBlock[2] = {x:0, y:5}; activeBlock[3] = {x:1, y:5}; break; } case 1:{ activeBlock[0] = {x:0, y:3}; activeBlock[1] = {x:0, y:4}; activeBlock[2] = {x:0, y:5}; activeBlock[3] = {x:0, y:6}; break; } case 2:{ activeBlock[0] = {x:0, y:5}; activeBlock[1] = {x:1, y:4}; activeBlock[2] = {x:1, y:5}; activeBlock[3] = {x:2, y:4}; break; } case 3:{ activeBlock[0] = {x:0, y:4}; activeBlock[1] = {x:1, y:4}; activeBlock[2] = {x:1, y:5}; activeBlock[3] = {x:2, y:5}; break; } case 4:{ activeBlock[0] = {x:0, y:4}; activeBlock[1] = {x:1, y:4}; activeBlock[2] = {x:1, y:5}; activeBlock[3] = {x:1, y:6}; break; } case 5:{ activeBlock[0] = {x:0, y:4}; activeBlock[1] = {x:1, y:4}; activeBlock[2] = {x:2, y:4}; activeBlock[3] = {x:2, y:5}; break; } case 6:{ activeBlock[0] = {x:0, y:5}; activeBlock[1] = {x:1, y:4}; activeBlock[2] = {x:1, y:5}; activeBlock[3] = {x:1, y:6}; break; } } //방금 생산 한 네 개의 작은 격자 가 초기 화 된 위치 에 놓 일 수 있 는 지 확인 합 니 다.for(var i=0;i<4; i++){ if(!isCellValid(activeBlock[i].x, activeBlock[i].y)){ return false; } } return true; } //아래로 이동 function moveDown(){/바닥 경 계 를 검사 합 니 다.(checkBottomBorder(){/바닥 에 닿 지 않 으 면 현재 그림,erase()를 지 웁 니 다./현재 도형 좌표 for(var i=0;i<4; i++){ activeBlock[i].x = activeBlock[i].x + 1; } //현재 그림 paint()다시 그리 기;}//바닥 에 닿 으 면 else{/현재 타이머,즉 자동 으로 아래로 이동 하 는 것 을 멈 추 는 것 입 니 다.clearInterval(timer);/board 배열 을 업데이트 합 니 다.updateBoard();/var lines=deleteLine();/만약 소 행 이 있다 면,if(lines!=0){//업데이트 점수 score=score+lines*10;updateScore(); //전체 판 넬 eraseBoard 지우 기();/패 널 paintBoard 다시 그리 기();}//새로운 도형 을 만 들 고 최초의 위치 에 놓 을 수 있 는 지 판단 합 니 다.if(!generateBlock()){ alert("Game over!"); status = 2; return; } paint(); //타이머,1 초 에 한 번 씩 moveDown timer=setInterval(moveDown,1000)}//왼쪽 이동 function moveLeft(){if(checkLeft Border(){erase();for(var i=0; i<4; i++){ activeBlock[i].y = activeBlock[i].y - 1; } paint(); } } //오른쪽 이동 함수 moveRight(){if(checkRightBorder()){erase();for(var i=0; i<4; i++){ activeBlock[i].y = activeBlock[i].y + 1; } paint(); } } //회전 합 니 다.회전 한 후에 사각형 이 있 는 칸 을 덮어 쓸 수 있 기 때 문 입 니 다.//tmp Block 을 사용 하여 activeBlock 의 내용 을 모두 tmp Block 으로 복사 합 니 다./tmp Block 에 회전 을 시도 합 니 다.회전 한 후에 사각형 이 충돌 하지 않 은 것 을 발견 하면//회전 한 tmp Block 의 값 을 activeBlock 에 복사 합 니 다.function rotate(){var tmp Block=new Array(4);for(var i=0; i<4; i++){ tmpBlock[i] = {x:0, y:0}; } for(var i=0; i<4; i++){ tmpBlock[i].x = activeBlock[i].x; tmpBlock[i].y = activeBlock[i].y; } //먼저 네 개의 점 의 중심 점 을 계산 하면 이 네 개의 점 은 중심 을 중심 으로 90 도 회전한다.var cx = Math.round((tmpBlock[0].x + tmpBlock[1].x + tmpBlock[2].x + tmpBlock[3].x)/4); var cy = Math.round((tmpBlock[0].y + tmpBlock[1].y + tmpBlock[2].y + tmpBlock[3].y)/4); //회전 하 는 주요 알고리즘 입 니 다.이렇게 분해 해서 이해 할 수 있 습 니 다./먼저 원점 을 중심 으로 회전한다 고 가정 하 세 요.그리고 중심 점 의 좌 표를 더 하 세 요.for(var i=0; i<4; i++){ tmpBlock[i].x = cx+cy-activeBlock[i].y; tmpBlock[i].y = cy-cx+activeBlock[i].x; } //회전 후 격자 가 합 법 적 인지 확인 합 니 다.for(var i=0;i<4; i++){ if(!isCellValid(tmpBlock[i].x,tmpBlock[i].y)){ return; } } //합 법 적 이면 erase()를 지 웁 니 다./activeBlock 에 값 을 다시 할당 합 니 다.for(var i=0;i<4; i++){ activeBlock[i].x = tmpBlock[i].x; activeBlock[i].y = tmpBlock[i].y; } //다시 그립 니 다.paint();}//왼쪽 경 계 를 확인 하고 합 법 적 인지 왼쪽 으로 이동 하려 고 합 니 다.function checkLeft Border(){for(var i=0;i17|x<0|y>9|y<0){return false;}if(board[x][y]==1){ return false; } return true; } //function erase(){for(var i=0;i<4; i++){ tbl.rows[activeBlock[i].x].cells[activeBlock[i].y].style.backgroundColor="white"; } } //활성 도형 함수 paint(){for(var i=0;i<4; i++){ tbl.rows[activeBlock[i].x].cells[activeBlock[i].y].style.backgroundColor="red"; } } //board 배열 function updateBoard(){for(var i=0;i<4; i++){ board[activeBlock[i].x][activeBlock[i].y]=1; } } //취소 함수 deleteLine(){var lines=0;for(var i=0; i<18; i++){ var j=0; for(; j<10; j++){ if(board[i][j]==0){ break; } } if(j==10){ lines++; if(i!=0){ for(var k=i-1; k>=0; k--){ board[k+1] = board[k]; } } board[0] = generateBlankLine(); } } return lines; } //전체 판 넬 function eraseBoard(){for(var i=0;i<18; i++){ for(var j=0; j<10; j++){ tbl.rows[i].cells[j].style.backgroundColor = "white"; } } } //전체 판 넬 function paintBoard(){for(var i=0;i<18;i++){ for(var j=0; j<10; j++){ if(board[i][j]==1){ tbl.rows[i].cells[j].style.backgroundColor = "red"; } } } } //공백 줄 을 만 듭 니 다.function generateBlankLine(){var line=new Array(10);for(var i=0; i<10; i++){ line[i] = 0; } return line; } //업데이트 점수 함수 updateScore(){document.getElementById("score").innerText=""+score;}//키보드 제어 기능 keyControl(){if(status!=1){ return; } var code = event.keyCode; switch(code){ case 37:{ moveLeft(); break; } case 38:{ rotate(); break; } case 39:{ moveRight(); break; } case 40:{ moveDown(); break; } } } //시작 function begin(e){e.disabled=true;status = 1; tbl = document.getElementById("board"); if(!generateBlock()){ alert("Game over!"); status = 2; return; } paint(); timer = setInterval(moveDown,1000); } document.onkeydown=keyControl; Score: 0
<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
[Ctrl+A 선택:외부 Js 를 도입 하려 면 페이지 를 새로 고침 해 야 실행 할 수 있 습 니 다.]

좋은 웹페이지 즐겨찾기