1. 핵심 포인트와 문제점 요약
1. JavaScript 상속의 경우 상위 클래스는 메소드 공유만 제공하는 것이 가장 좋으며, 생성자가 혼합되는 것을 방지하기 위해 속성은 각 하위 클래스에 기록됩니다. 상위 클래스와 하위 클래스.
2. 프로토타입 시뮬레이션 상속을 위한 코드는 모든 메소드 정의 전에 작성되어야 합니다. 그렇지 않으면 프로토타입 객체가 변경되고 메소드가 정의되지 않게 됩니다.
Hero.prototype = new Tank (0, 0, 0)
Hero.prototype.constructor = 영웅 ;
Hero.prototype.addLife = function(){
this.lifetimes ;
document.querySelector("#life").innerHTML = Hero.lifetimes; 🎜>
3. 캔버스에 그래픽을 그릴 때 사각형을 그리는 것 외에도 ctx.beginPath() 및 ctx.closePath()를 추가해야 합니다. 그렇지 않으면 예기치 않은 오류가 발생합니다.
4. concat 함수는 배열을 병합하거나 요소를 새 배열로 반환할 수 있습니다.
5. Image의 src 속성이 할당되면 이미지가 로드되지만 로드가 완료되지 않으면 이미지가 그려지므로, onload 이벤트 처리를 사용하세요
6. Array 함수를 확장하고 지정된 요소를 삭제합니다
Array.prototype.deleteElement = function(obj) {
if (obj) {
for (var i = 0; i < this.length; i ) {
if (this[i] === obj) {
this.splice (i , 1);
}
}
}
}
7. 타이머 설정, setInterval("fun",1000) 메소드의 첫 번째 매개변수는 다음과 같습니다. "hero.say()"와 같은 문자열은 이 코드 문자열을 실행하기 위한 eval과 유사하므로 매개변수를 함수에 가져오고 이 함수의 실행 컨텍스트도 지정할 수 있습니다. 하지만 함수가 핸들로 전달되면 매개변수를 사용할 수 없고 컨텍스트를 지정할 수 없습니다. 첫 번째 방법 외에도 클로저를 사용하여 이 문제를 해결했습니다.
this.timer = setInterval((함수(컨텍스트) {
return function () {
Bullet.prototype.move.call (context)
}
}) (this), 30)
저장했습니다. 현재 실행 환경에서 호출 메소드를 호출하여 수동으로 실행합니다.
8. 기능 외에도 메소드의 기능적 설계에는 이 기능을 실행하기 위한 조건 감지가 포함되어야 합니다. 예를 들어 이동에는 이동할 수 있는 상황과 이동할 수 없는 상황이 포함되어야 합니다. . 이 테스트를 외부에 배치해서는 안 됩니다.
9. 코드를 작성할 때 디자인이나 최적화 문제를 먼저 생각하고 나서 최적화를 이야기하거나, 디자인을 먼저 하고 나서 구현하면 안 됩니다. 사고는 혼란스럽지 않고 명확해야 하며 한 가지 점에 집중해야 합니다.
10. JavaScript에는 sleep 함수가 없습니다. 간격 실행 목적을 달성하기 위해 변수를 생성할 수 있습니다.
2. 코드 구현
1. 프로그램은 Bomb.js,Bullet.js,Draw.js,Tank.js,index.html,img,music,
최종 효과
로 구분됩니다.
3. 코드
1.index.html