▶ addEventListener에서의 화살표 함수 주의사항 화살표 함수는 자신만의 this를 가지지 않기 때문에 자신을 포함하고 있는 함수의 this를 상속받는다 this를 사용해야하는 경우 addEventListener에서는 일반 함수로 사용하기 더보기 function arrow function ▶ 출력

▶ 이벤트 동작 취소 실습 copy 이벤트 동작 취소 콘텐츠를 복사하는 것을 방지한다 copy 이벤트 동작 취소 form 제출 시 페이지 새로고침 동작 취소 form 요소의 submit 동작 (action 값으로 요청)을 취소시킨다 더보기 중요한 내용 Submit ▶ 출력

▶ 이벤트 기본 동작 취소하기 HTML의 각 요소가 기본적으로 가지고 있는 이벤트가 때로는 방해가 되는 경우도 있다. 그래서 이벤트의 기본 동작을 취소할 필요가 있음 ex) form 요소의 제출 이벤트를 취소하여, 페이지 새로고침을 막을 수 있다. a 요소를 클릭할 때 페이지 이동을 막고 추가 로직을 수행할 수 있다. 해당 이벤트에 대한 기본 동작을 실행하지 않도록 지정한다

▶ lodash 모듈성, 성능 및 추가 기능을 제공하는 JavaScript 유틸리티 라이브러리 array, object 등 자료구조를 다룰 때 사용하는 유용하고 간편한 함수들을 제공한다 * 참고 https://lodash.com/ Lodash _.defaults({ 'a': 1 }, { 'a': 3, 'b': 2 });_.partition([1, 2, 3, 4], n => n % 2);DownloadLodash is released under the MIT license & supports modern environments. Review the build differences & pick one that’s right for you.InstallationIn lodash.com

▶ 로또 번호 생성기 실습 더보기 로또 추천 번호 행운 번호 받기 ▶ 출력

▶ todo 실습 todo 추가 기능 구현 1. 빈 문자열 입력 방지 2. 입력이 없을 경우 경고 대화상자를 띄운다 더보기 + ▶ 출력하기

▶ click & input 이벤트 실습 사용자의 입력 값을 실시간을 출력한다 '+' 버튼을 클릭하면, 출력한 값의 CSS 스타일을 변경할 수 있다. 더보기 클릭 ▶ 출력

▶ input 이벤트 실습 사용자의 입력 값을 실시간으로 출력하기 더보기 ▶ 출력

* 스켈레톤 코드 다운받기 ▶ click 이벤트 실습 버튼을 클릭하면 숫자를 1씩 증가시키기 더보기 버튼 클릭횟수 : 0 ▶ 결과

▶ event handler 활용 실습 1. 버튼을 클릭하면 숫자를 1씩 증가해서 출력하기 2. 사용자의 입력 값을 실시간으로 출력하기 3. '+' 버튼을 클릭하면 출력한 값의 CSS 스타일 변경하기 4. todo 프로그램 구현 5. 로또 번호 생성기 구현