개발일지

addeventlistener for loop 문제2

고고싸이트 2022. 6. 24. 22:02

addeventlistener의 파라미터 펑션은 anonymous function이라고 한다. 함수에 이름 등 구별자 아무것도 없이

으로 시작하는 것들 등이다. 따라서 선언 이후 접근이 불가능해진다. 

어쨌든 전에 말했던 포인터 문제를 회피하기 위해서는 클로저가 필요한데 이는 

형식이고 Immediately-Invoked Function Expressions라고 불린다.

 

https://stackabuse.com/javascripts-immediately-invoked-function-expressions/

 

또는 w3s에서 Self-Invoking Functions라고 적혀있다. 아니 근데 클로저가 저걸 말하는게 맞긴 한가?

지금 보면 저건 지역변수랑도 상관 없이 그냥 self invoke라고 되어 있는데. 그럼 루프 이벤트리스너는 대기 타고 있다가 루프 끝나고 한번에 처리되면서 i값을 포인터로 가져가는거고 

이 셀프 인보크 방식은 각 이터레이션에 무조건 한번씩 실행되어 루프의 i값을 때려 넣는다는것인가.

어쨌든 지금 자바 처음 접한지 한 5일 되었나. 오늘 컴퓨터 앞에 12시간이 넘어서 지친것 같다.

사실 링크 주소 읽어서 바로 이동 버튼 만드는건 노가다로 해도 충분하지만 더 좋은 방식을 써보고 싶으니 자꾸 이것저것 건들게 된다. 

 

클로저와 셀프 인보크는 아예 다른것 같다.. 대체 내가 뭘 생각했던건지도 모르겠다.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures#creating_closures_in_loops_a_common_mistake

 

 

addEventListener 안에 function(var){} 에서 var에 무슨 임시 변수명을 지정하던지 간에 그 안에는 even handler가 들어간다.

 

 

(i)를 안쪽으로 빼나 뒤로 빼나 다 작동함.

 

첫번째 제일 쉬운 방법인 클로저 방법 성공.

뒷으로 들어가는 외부의 변수는 어노미너스 펑션의 앞으로 자동 전달되는것으로 보임.

 

var 대신 let 쓰는건 멋이 없어서 패스.

 

forEach방법.

https://www.w3schools.com/jsref/jsref_foreach.asp

 

https://softauthor.com/javascript-for-loop-click-event-issues-solutions/

 

https://www.codegrepper.com/code-examples/javascript/foreach+javascript+arrow+function

 

즉 query로 만든 어래이를 가지고 이벤트 부착할때 쓰인다.

 

https://www.programiz.com/javascript/forEach

 

 

새로운 함수 안배울려고 이악물고 쉬운방법만 찾았는데 클로저 찾고나니 결국엔 포이치 찾게되고 다 알고나니 재밌네. forEach같은 경우 위 for와 같이 익명함수 var에 대한 걱정을 안 해도 된다고 한다.

 

포이치 작동성공.

 

오늘은 마무리하고 내일 그 최종 보스로 보이는 버블링 이펙트인지 뭔지 한번 해봐야겠다.

 

 

위하고 아래는 같다.

'개발일지' 카테고리의 다른 글

CSS Attribute Selectors  (0) 2022.06.25
버블링 이벤트와 캡쳐링  (0) 2022.06.25
addeventlistener for loop 문제  (0) 2022.06.24
테스트3 v4 (robots 금지 처리 완료)  (0) 2022.06.24
버튼 클래스 추가 문제  (0) 2022.06.24