반응형 자바스크립트14 [Javascript] 반복문 for.. in 과 for.. of 의 차이 지난 포스팅에서 배열이 내장함수인 forEach()에 대한 기초적인 내용들을 정리를 해보았습니다. forEach, for...in을 이용한 반복문 기초(ft. 배열, 객체 Data 뽑기) forEach, for...in을 이용한 반복문 기초(ft. 배열, 객체 Data 뽑기) forEach, for...in을 이용한 반복문 기초 프로그램밍을 공부하면서 사람에게 가장 쉽게(?) 다가오는 기능은 바로 '반복문'과 '조건문'이라고 생각합니다. 왠지 내가 코딩 천재가 된 것 같은 착각 아닌 kincoding.com 그러면서 for.. in 반복문도 함께 살펴보았는데요, 이놈의 Javascript에는 for.. of 라는 반복문 형태가 또! 존재합니다. 비슷한 게 뭐가 이리 많어, 헷갈리게! 싶은데요. 역시나 자.. 2023. 1. 5. 이벤트 버블링 그리고 e.target, e.currentTarget 기초 정리 웹페이지를 해석해서 보여주는 브라우저(Browser)의 동작방식 중에는 '이벤트 버블링(Event Bubbling)'이라는 현상이 존재합니다. 왠지 용어가 일반적이지 않고 뭔가 전문가 포스 같은 느낌이 나서 괜히 어렵게 느껴지는 것도 같습니다. 일반적인 사용 케이스에서 살펴보자면, 버튼을 누른 것도 아니고 배경화면을 클릭한 것 뿐인데도 모달창이 닫히게 되는, 뭐 그런 현상들이 바로 이벤트 버블링 현상이 만들어내는 경우입니다. 이번 포스팅에서는 이러한 '이벤트 버블링'과 관련하여 "전문적"이 아닌 "현상적"인 이해를 경험 해보기로 합니다. 이벤트 버블링(Event Bubbling) 일단 테스트를 위한 코드를 간단하게 작성해보도록 합니다. div 태그로 박스를 세 개 만들었습니다. 이벤트 버블링 아래 이미지.. 2023. 1. 3. Bootstrap 기초 class 사용 + Javascript 조작하기 연습 이전 포스팅에서, 부트스트랩을 이용한 레이아웃 구성을 살펴봤습니다. container, row, column에 대해서 살펴봤습니다. 이번에는 약간 더 나아가서 이를 이용해서 간단한 레이아웃을 구성하는 연습을 해보려고 합니다. 그리고 이후에 Javascrip로 핸들링까지 해보려 합니다. Bootstrap 기초 class 사용 + Javascript 조작하기 연습 초보인 경우 이 포스팅을 진행하기 전에, 이전 내용을 먼저 확인하면 도움이 됩니다. 부트스트랩 Layout의 시작 - BreakPoints, Container, Grid 부트스트랩 Layout의 시작 - BreakPoints, Container, Grid Bootstrap은 그냥 예제 코드를 가져다 복붙해서 사용하는 아주 편리한 방식을 제공합니다... 2022. 12. 26. setTimeout(), clearTimeout() 기본 동작 방식 살펴보기 setTimeout(), clearTimeout() 지난 번에 Web 애플리케이션을 만들면서 시간 차를 두고 동작하는 기능에 대한 구현이 필요했었습니다. 그래서 예전에 봐두었던, setTimeout()과 celarTimeout() 함수를 떠올리게 되었고 사용을 하려고 했는데, 돌아서면 까먹는 나이다 보니 잘 생각이 나지 않더라구요. 그래서 오늘은 실행 타이밍을 제어할 수 있는 이 기능에 대해서 정리해두려고 합니다. setTimeout() 기본 동작 방식 setTimeout()은 타이머(Timer) 기능을 한다고 보면 됩니다. 말 그대로 '타임 아웃!' 되는 순간을 세팅해두는 것이죠. 기본적인 사용문법은 다음과 같습니다. setTimeout(() => { 실행할코드 }, 지연시간); setTimeout((.. 2022. 12. 23. 이전 1 2 3 4 다음 반응형
