컴퓨터는 잘못이 없다..

[만들 그림판] [그림판 예제 코드] 그림판 1 2 3 4 5 6 7 8 9 10 배경색 지우개 기능 [참고] 1. 여기서 등장하는 x축과 y축 2.casvas영역? 3.rgb

[예제코드] [실행결과] [알아둬야할점!] 1. object 형을 참조하려면 변수가 들어있는 변수명.키값으로 .(dot)으로 참조 가능하다. 반대로 생각해서 .(dot)으로 참조한다면 이건 object type 이다! 라고도 생각할 수 있어야함! 2.object형에 함수가 들어있다면? 변수명.키값 까지만 쓰면 참조 변수명.키값() 까지 쓰면 함수 실행 3. object형에 배열이 들어있다면? 변수명.키값 까지만 쓰면 배열 전체 참조 변수명.키값[인덱스] 까지 쓰면 배열 index별 요소를 참조할 수 있다!

[QUIZ] 아래 20칸의 box를 클릭했을 때 clicked가 나오도록 구현하시오! [hint] 1. for과 foreach 둘다 구현해보기! 2. document.querySelectorAll("div")[i].addEventListener(); 사용하기! 3. this.innerText [정답 코드] EventListener 퀴즈 [코드 해설] 정답1,4 와 정답2,3의 차이? 정답2,3은 외부에서 변수,함수에 접근 가능하다. 정답1,4는 즉시실행함수로 감싸주어 내부 변수,함수에 접근하지 못한다. 실제로 f12를 통해 divs를 눌러봐도 보지 못함!

[예제코드] key event 처리 [실행 결과]

[addEventListener의 callback함수 매개변수] -eventListener 의 callback 함수의 매개변수로 event에 대한 정보가 object 형태로 들어간다. -mousemove이벤트에 대한 객체정보가 evnet에 {isTrusted: true, screenX: 282, screenY: 512, clientX: 282, clientY: 409, …} 이런 형태로 들어간다. -또한 모든 event는 object정보를 가지고 있다. [예제코드] EventListener 테스트중... [코드 결과]

[addEventListener 과 callback함수] -callback함수의 정확한 정의 javascript에서는 callback 함수는 다른 함수의 매개변수로 함수를 전달하고, 어떠한 이벤트가 발생한 후 매개변수로 전달한 함수가 다시 호출되는 것을 의미합니다. callback은 쉽게 말하자면 어떤 일을 다른 객체에게 시키고, 그 일이 끝나는 것은 기다리지 않고 끝나고 부를 때까지 다른 일을 하는 것을 말합니다. 그렇기 때문에 non-block이며, 비동기 방식의 함수를 사용합니다. -addEventListener 작성하는 법 .addEventListener(string type "event name", function type call back function) ex) .addEventListene..