컴퓨터는 잘못이 없다..

[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..

[즉시 실행 함수] └게임속에 이러한 코드가 있다고 하자. point가 1000점 이상 되면 client에게 선물은 준다고 해보자. let point와 if문 둘다 global로 선언된 상태이다. 그렇다면 브라우저의 F12 기능을 통해서 point의 값을 조작할 수 있을 것이다! 이때 어떻게 하면 해결할 수 있을까? -> 즉시실행함수! [예제코드1] EventListener 테스트 [예제 코드1 실행 결과] [예제코드2] [예제 코드2 실행 결과] >>실행결과 맨아래 point2, poin3, poin4 즉시실행함수 내에 선언된 변수에 접근 못한다고 했는데?? --> 이건 그냥 콘솔에서 접근해본거고 접근했다고 해서 실제로 값이 변경되어 선물증정! 이 되지 않는다. >>즉시실행함수에 넣지 않는 test()..

[기본 개념] >> splice()함수 └splice(n,m) : 인덱스 n으로 부터 m 개를 배열에서 삭제해라 >> length로 배열 비우기 └배열명.length = 0; : 배열명.length에 강제로 0을 넣으면 배열이 비워진다. >> forEach로 배열 출력하기 -forEach()? forEach는 for문과 마찬가지로 반복적인 기능을 수행할 때 사용한다. 하지만 for문처럼 index와 조건식, increase를 정의하지 않아도 함수를 호출하지 않아도 자동으로 처음에 자기자신 호출해주는 함수를 통해 기능을 수행할 수 있다. -forEach() 내의 function() script 내에 썼으니.. 페이지가 로딩되는 시점에 함수를 호출하지 않아도 알아서 호출된다. 함수 값을 전달하는 것이 아닌,..