javascript
-
자바스크립트 실행컨텍스트에 대하여 ( Excution context)javascript 2021. 4. 8. 15:10
클로저에 대해서 찾아보는 도중에 실행컨텍스트에 대한 내용이 선행이 되면 좋다고 한다. 클로저뿐만아니라 , this, scope, hoisting 에 대해서 이해하기도 쉬워 진다고 하니까 먼저 어떤 내용인지 알아보자 정의 : 실행가능한 코드가 되기 위한 실행 환경 이다. 여기서 실행가능한 코드란 전역코드와 함수내의 코드이다. 코드를 실행하는데 필요한 정보 1. 변수에대한정보 : (전역변수,지역변수,매개변수,객체의 속성) 2. 변수의 유효범위 3. this 4. 함수의 선언 함수의 실행과 실행 컨텍스트 스택 1. 함수를 실행하면 스택이 생기고 완료되면 소멸한다. 2. 전역실행컨텍스트는 어플리케이션이 종료될때가지 유지된다. 3. 위 그림에서 박스 하나가 실행컨텍스트스택 하나라고 보면된다. 4. 각각의 실행컨텍..
-
Event bubbling , Event capture , Event delegationjavascript 2021. 4. 7. 15:57
이벤트 버블링 에 대해서 발생한 이벤트가 상위 노드로 계속 전달되는것 정도로만 알고 있었다. stoppropagation 을 사용할 일이 있어서 같이 적어두고 event capture 랑 event delegation 에 대해서도 알아보자 보통 이런 팝업창은 엑스표시를 눌려서 닫히기도 하지만 팝업창 밖에 를 눌르면 그냥 닫히기도 한다. 이럴때 어떻게 해주면 될까? 위코드처럼 클로즈 모달 함수를 밖에 박스에 걸어두면 된다... 당연한 이야기긴 하다.ㅎㅎㅎ 그런데 div 박스에 stopPropagation 이라는 함수를 걸어주기 않게되면 어떻게 될까? 바로 해당 박스만 눌럿을 뿐인데 이벤트가 버블링 되어 밖에 박스를 누를거와 같게되 onCloseModal 함수가 실행이 되게 된다. 그러므로 그냥 창이 닫힌다..