JavaScript

JavaScript

Document Fragment

여러 노드를 하나의 그룹으로 감싸 다른 곳으로 전달하게 해주는 Wrapper 노드이다. 리액트에서의 Fragment와도 의미상 비슷한 개념이라고 볼 수 있겠다.

Read
JavaScript

JavaScript의 prototype

Java와 같은 클래스 기반 언어에서는 Class를 통해 객체를 생성하는데, JavaScript는 Class가 없어 Function과 prototype을 통해 객체를 만든다. 이 때문에 자바스크립트는 프로토타입 기반 언어라고도 불린다. Function의 기본 property인 prototype과 객체의 기본 property인 __proto__, 그리고 프로토타입 체인에 대해 알아본다.

Read
JavaScript

JavaScript의 작동 원리

자바스크립트 런타임은 어떻게 구성되어있고 싱글쓰레드의 장단점, 그리고 자바스크립트에서 왜 그렇게 비동기가 중요한 개념인지 알아보자.

Read
JavaScript

객체 모델(DOM, BOM)

자바스크립트는 큰 틀에서 보면 DOM, BOM, 그리고 Core로 분류된다고 한다. 참고로 Core는 문법, 라이브러리 등을 의미한다는 점 정도로만 알아두고, 객체 모델인 DOM과 BOM에 대해 다뤄본다.

Read
JavaScript

JavaScript의 전역 객체

자바스크립트의 전역 객체는 모든 객체의 최상위 객체를 의미한다. 브라우저 환경에서는 window, 노드 환경에서는 global이 전역 객체이다.

Read
JavaScript

HTMLCollection vs NodeList

DOM을 조작할 때 접하게 되는 유사배열들이다. Live하냐 Static하냐의 차이가 중요한데, 이를 인지하고 있지 못하면 언젠간 버그를 마주칠 수밖에 없겠다.

Read
JavaScript

JavaScript의 for 반복문들

자바스크립트의 for 관련 반복문은 다른 언어에 비해 가짓수가 많아보인다. 한번 정리하고, 더 헷갈리지 말도록 하자. for, for in, for of, 그리고 성격은 약간 다르지만 forEach에 대해 알아본다.

Read
JavaScript

Throttling과 Debouncing

연이어 발생하는 이벤트에 의해 무의미한 리소스 낭비가 일어나지 않게끔 방지하는 기법들이다. 쓰로틀링은 특정 텀을 두고 주기적으로만 콜백함수를 실행하는 방법으로 scroll 이벤트에 많이 쓰이고, 디바운싱은 연이은 호출을 이른바 하나로 퉁치는 방법으로 ajax 통신에 많이 쓰인다.

Read