자바라는 언어의 큰 특징 및 객체지향의 Getter/Setter에 대하여 적어본다. 해당 메서드를사용하는 이유는 필드 값에 부적절한 값이 대입되는 것을 막기 위해서이다. (각 객체들의 캡슐이 깨지지 않게 하기위함도 있으며, 외부로 부터 변수를 보호 및 숨김으로써 접근하는것을 막으며, 안정성 확보도 있다.) 추가로 안정성 확보라고 말한것은, 프로젝트의 보안을 위해서 접근제어자인 private을 통해서 외부접근을 막고 Getter/Setter를 통해서 접근하며 이 또한 객체의 무결성을 보장하기 위함이다. (객체의 무결성의 대한 간단한 질문/응답의 설명은 링크로..! ↓↓↓↓) https://okky.kr/article/716403?note=1979724 OKKY | 객체의 무결성이 무엇인가요? Getter와..

플레이어에게 생명을 부여하기 [ lesson10 단계의 설명 ] 생명을 구현하는 방법은 아주 간단하다. 먼저 변수를 선언했던 곳과 같은 장소에서 변수를 추가하여 생명 수를 저장하게 한다. var lives = 3; //남은 생명 수 남은 생명 수를 표시하는 방법은 점수 카운터가 그려지는 것과 같은 형태. drawScore()함수 아래에 다음 기능을 추가. function drawLives() { ctx.font = "16px Arial"; ctx.fillStyle = "#0095DD"; ctx.fillText("Lives: "+lives, canvas.width-65, 20); } 지금까지 바닥에 닿으면 바로 게임을 끝내는 형식이었고 이제는 더 이상 게임을 이용할 수 없게 될 때까지 남은 생명 수를 줄여..

마우스 이동 감지하기 [ lesson09 단계의 설명 ] 마우스 움직임을 감지하는 것은 키 누름을 감지하는 것보다 더욱 쉽다. 필요한 것은 mousemove (en-US) 이벤트에 대한 리스너이니, 이 keyup event 바로 아래에 이 행을 추가 document.addEventListener("mousemove", mouseMoveHandler, false); 마우스 움직임에 따라 패들 이동하기 포인터 좌표에 따라 패들 위치를 업데이트할 수 있다. 다음의 핸들러 함수가 이것을 해주는것이고, 추가한 이전 줄 아래에 다음 함수를 추가해준다. function mouseMoveHandler(e) { var relativeX = e.clientX - canvas.offsetLeft; if(relativeX >..

점수 계산하기 [ lesson08 단계의 설명 ] 점수를 받기위한 변수 선언 및 초기화 var score = 0; 점수 화면을 만들고, 업데이트를 하기 위해서 drawScore() 함수가 필요 아래 코드를 collisionDetection() 함수 아래에 추가 function drawScore() { ctx.font = "16px Arial"; ctx.fillStyle = "#0095DD"; ctx.fillText("Score: "+score, 8, 20); } 텍스트를 캔버스 안에 그리는 것은 도형을 그리는 작업과 비슷하다. 폰트를 정의하는 것은 CSS에서의 작업과 같으며. — font() (en-US) 함수에서 크기와 타입을 설정할 수 있습니다. 그런 다음 fillStyle() (en-US) 함수를 ..

- accessor 이진 버퍼에 저장된 데이터 요소의 수와 형식을 설명하는 개체. - animation 타임스탬프를 포함한 키프레임 데이터와 영향을 받는 대상 속성을 설명하는 개체. - back-facing 얼굴을 본다. - buffer 바이트의 선형 배열을 나타내는 외부 또는 포함된 리소스. - buffer view 특정 버퍼의 범위를 나타내는 개체와 버퍼의 콘텐츠 해석 방법을 제어하는 선택적 메타데이터. - camera 장면을 렌더링하는 데 사용되는 투영 파라미터를 정의하는 개체. - facingness 정점의 방향(결합 순서)에 따라 삼각형을 정면 또는 역면으로 분류한다. - front-facing 얼굴을 본다. - image PNG와 같이 표준화된 비트스트림으로 인코딩된 2차원 픽셀 배열. - i..

상속과 프로토타입 체인에 대한 실습 및 예제