본문 바로가기

DEV/Note

(4)
JavaScript 이벤트 처리 개요 이 글은 JavaScript를 사용할 때 많이 작업하게 되는 이벤트 처리에 대해 정리한 내용입니다. 간단하게 아래 4가지에 대해서만 알아보겠습니다. 이벤트 처리기 등록 이벤트 처리기 제거 이벤트 전파 이벤트 취소 이벤트 처리기 등록 우리가 웹사이트를 이용하며 버튼을 클릭하거나 스크롤을 내릴 때 JavaScript에서는 이 행동들을 이벤트라고 부릅니다. 이벤트가 발생한 DOM에는 이벤트 인터페이스를 기반으로한 객체가 전달되는데, EventTarget.addEventListener 메서드를 사용하여 이벤트 객체를 전달 받을 수 있습니다. 문법 EventTarget.addEventListener(type, listener [, options]); EventTarget.addEventListener(typ..
console.log 한방에 지우기 console.log 한방에 지우기 console.log는 사용하기 간편하여 자바스크립트로 개발할 때 많이 사용되는데요. 보통 개발할 때만 사용하고 상용(production)에 배포할 때는 모두 지워서 배포합니다. console.log를 반드시 지워야되는 건 아니지만 남겨두게 된다면 웹사이트에 접속한 누구나 개발자 도구를 통해 쉽게 log를 볼 수 있게되니까 되도록 지우도록 합시다. 신입때 팀장님이 console.log를 전부 지우라고해서 무식하게 일일이 지웠던 기억이 있는데요... 작업할 때는 console.log를 다시 입력하고, 배포할 때 다시 지우고... 정말 귀찮... 소개 babel-plugin-transform-remove-console이라는 babel 플러그인을 사용할건데요. webpack..
NodeJs에서 메모리가 부족할 때 NodeJs로 응용프로그램을 실행할 때 메모리로 인한 문제가 발생할 수 있는데, V8 옵션인 --max-old-space-size=를 사용하여 메모리 제한을 변경할 수 있습니다. node --max-old-space-size=4096 index.js 4GB로 변경한 예시입니다. 기본 메모리 제한 기본 메모리 제한은 32 bit 시스템에서 512MB, 64 bit 시스템에서는 1GB 이지만 V8 버전마다 다를 수 있다고 합니다. 참고 사이트 https://medium.com/@vuongtran/how-to-solve-process-out-of-memory-in-node-js-5f0de8f8464c https://nodejs.org/api/v8.html#v8_v8_getheapspacestatistics h..
웹브라우저에서 스크롤 정보를 가져오는 방법 이 글은 Window.scrollY - Web API | MDN의 내용을 참고하여 작성하였습니다. 스크롤 정보를 가져오는 방법 웹브라우저에서 현재 화면의 스크롤 정보를 알아야 할 경우가 있는데, 보통 아래의 방법을 많이 사용합니다. // 화면의 Y축의 상단값 window.scrollY // 화면의 Y축의 하단값 window.scrollY + window.innerHeight 브라우저 호환성 window.scrollY의 브라우저 호환성을 확인해보면 Internet Explorer(이하 IE)를 제외하고 모두 지원하며, 일부 모바일 환경에서 ?(알 수 없음)로 표시되어있습니다. 그리고 window.scrollY와 window.pageYOffset은 같은 속성이지만, 오래된 브라우저의 경우 window.scr..