I. 작성취지
목적 : 이번에 만든 게임프로젝트에서 이벤트리스너 및 핸들러 방식으로 만들지 않은 것이 무엇인지 찾고, 리팩토링 해보기
II. 비동기적 자바스크립트
1. 비동기적 프로그래밍
What (정의) : 기존의 작업이 끝나지않고 실행되는 동안에도, 다른 이벤트에 응답할 수있게 하는 기술
Why (존재이유) : 동기적 프로그래밍에서는 작업량이 큰 작업(장기실행 동기함수)이 있는 경우 다른 작업을 하기위해서는 이전 작업이 끝나고 난 뒤에 가능하다.
How (방법) : 이벤트리스너와 이벤트 핸들러를 이용한다. 그리고 콜백함수
e.g. (예) :
2. 이벤트 처리기 (이벤트핸들러 / 함수)
What (정의) : 이벤트가 발생한 경우 이벤트리스너가 호출하는 함수를 의미한다. 즉 비동기호출함수이다.
Why (존재이유) : 비동기프로그래밍을 하기 위해
How (방법) : 이벤트 발생을 이벤트리스너로 듣고, 호출한다.
e.g. (예) :
3. 이벤트 기반 프로그래밍 : EDP (Event Driven Programing)
What (정의) : 이벤트 감지 후 이를 대응하기 위한 처리(함수)를 호출해야하는데 이 함수를 미리 등록하는 것.
Why (존재이유) : 이벤트 감지와 대응 위해서
How (방법) : 이벤트 리스너에 콜백함수를 등록(즉 이벤트 리스너에 등록된 콜백함수)을 이벤트 핸들러라고한다.
e.g. (예) : 일본은 지진이 많은나라이다. 지진을 미리 예측할수는 없는데, 지진(이벤트)이 일어난 경우 지진을 감지(이벤트리스너)하면, 미리 작성한 메뉴얼(이벤트핸들러 <= 콜백함수)이 있다.
4. 이벤트 핸들러 등록(처리방식)
우선 이벤트란 유저, 브라우저가 취하는 동작을 의미한다.
이러한 이벤트에 핸들러를 등록할 경우에 'on'으로 시작해야한다 (e.g. onclick...)
함수호출하는 형태 , 함수 자체를 전달하는 형태
두가지의 가장 큰 차이는 인자 여부에 따라서 차이가있다
인자가 있다면(有) 콜백함수를 이용하고, 인자가 없다면(無) 함수자체를 전달하면된다
그 이유는 인자(有)가 있는데 함수 자체를 전달하게 되면 함수 호출이 된다. 결국 이러한 호출은 상태 값등이 변할 수있다.
'배움 __IL > addtionalFrontEnd' 카테고리의 다른 글
TIL : 웹퍼블리싱 HTML 6회 (12,13) [완] (1) | 2023.02.04 |
---|---|
TIL : 웹퍼블리싱 HTML 5회 (10,11) (0) | 2023.01.30 |
TIL : JavaScript 특유 함수개념 정리 (0) | 2023.01.08 |
TIL : 웹퍼블리싱 HTML 4회 (8,9) (0) | 2023.01.07 |
TIL : 웹퍼블리싱 HTML 3회 (6,7) (0) | 2023.01.06 |