디스트럭처링 할당 디스트럭처링 할당(구조 분해 할당)은 구조화된 배열과 같은 이터러블 또는 객체를 destructuring(비구조화, 구조 파괴)하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다. 배열과 같은 이터러블 또는 객체 리터럴에서 필요한 값만 추출하
배열 메소드 자바스크립트는 배열을 다룰 때 유용한 빌트인 메서드를 제공한다. 배열 메서드는 결과물을 반환하는 패턴이 두 가지이므로 주의가 필요하다. 배열에는 원본 배열(배열 메서드를 호출한 배열)을 직접 변경하는 메서드(mutator method)와 원본 배열을 직
고차 함수(Higher-Order Function, HOF)는 함수를 인수로 전달받거나 함수를 반환하는 함수를 말한다. 자바스크립트의 함수는 일급 객체이므로 함수를 값처럼 인수로 전달할 수 있으며 반환할 수도 있다. 고차 함수는 외부 상태의 변경이나 가변(mutabl
scroll, resize, input, mousemove 같은 이벤트는 짧은 시간 간격으로 연속해서 발생한다. 이러한 이벤트에 바인딩한 이벤트 핸들러는 과도하게 호출되어 성능에 문제를 일으킬 수 있다.디바운스(debounce)와 스로틀(throttle)은 짧은 시간
함수가 자기 자신을 호출하는 것을 재귀 호출(recursive call)이라 한다. 재귀 함수는 자기 자신을 호출하는 행위, 즉 재귀 호출을 수행하는 함수를 말한다.재귀 함수는 반복되는 처리를 위해 사용한다. 예를 들어, 10부터 0까지 출력하는 함수를 구현해보자.위
어떤 일을 반복 수행하는 repeat 함수를 정의해 보자.repeat 함수는 매개변수를 통해 전달받은 숫자만큼 반복하며 console.log(i)를 호출한다. 이때 repeat 함수는 console.log(i)에 강하게 의존하고 있어 다른 일을 할 수 없다. 따라서 만
동등 비교(loose equality) 연산자와 일치 비교(strict equality) 연산자는 좌항과 우항의 피연산자가 같은 값으로 평가되는지 비교해 불리언 값을 반환한다. 하지만 비교하는 엄격성의 정도가 다르다. 동등 비교 연산자는 느슨한 비교를 하지만 일치 비교
함수의 구분 ES6 이전까지 자바스크립트의 함수는 별다른 구분없이 다양한 목적으로 사용되었다. JS의 함수는 일반적인 함수로서 호출할 수도 있고, new 연산자와 함께 호출하여 인스턴스를 생성할 수 있는 생성자 함수로서 호출할 수도 있으며, 객체에 바인딩되어 메서드로
ES5까지 변수를 선언할 수 있는 유일한 방법은 var 키워드를 사용하는 것이었다. var 키워드로 선언된 변수는 다음과 같은 특징이 있다. 이는 다른 언어와는 구별되는 독특한 특징으로, 주의를 기울이지 않으면 심각한 문제를 발생시킬 수 있다.변수 중복 선언 허용var
클라이언트 사이드, 즉 브라우저에서 동작하는 간단한 웹 애플리케이션은 브라우저만으로도 개발할 수 있다. 하지만 프로젝트의 규모가 커짐에 따라 React, Angular, Lodash 같은 프레임워크 또는 라이브러리를 도입하거나 Babel, Webpack, ESLint
undefined 타입의 값은 undefined가 유일하다.var 키워드로 선언한 변수는 암묵적으로 undefined로 초기화된다. 다시 말해, 변수 선언에 의해 확보된 메모리 공간을 처음 할당이 이뤄질 때까지 빈 상태(대부분 비어 있지 않고 쓰레기 값(garbage
Summary JS가 제공하는 7가지 데이터 타입(number, string, boolean, null, undefined, Symbol, object)은 크게 원시 타입(primitive type)과 객체 타입(object/reference type)으로 구분할 수
구글의 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경인 Node.js의 등장으로 자바스크립트는 웹 브라우저를 벗어나 서버 사이드 애플리케이션 개발에서도 사용할 수 있는 범용 개발 언어가 되었다. 하지만 자바스크립트가 가장 많이 사용되는 분야는 역시 웹 브라
스코프란? 스코프(유효범위)는 자바스크립트를 포함한 모든 프로그래밍 언어의 기본적이며 중요한 개념이다. var 키워드로 선언한 변수와 let 또는 const 키워드로 선언한 변수의 스코프는 다르게 동작한다. 스코프는 변수 그리고 함수와 깊은 관련이 있다. 우리는 스
다음 예제를 살펴보자.변수 선언문보다 변수를 참조하는 코드가 앞에 있다. 자바스크립트 코드는 인터프리터에 의해 한 줄씩 순차적으로 실행되므로 console.log(score)가 가장 먼저 실행되고 순차적으로 다음 줄에 있는 코드를 실행한다. 따라서 console.log
클래스는 다음과 같은 기본 문법을 사용해 만들 수 있다.이렇게 만든 클래스는 new MyClass() 호출을 통해 내부에서 정의한 메서드가 들어있는 객체를 생성한다.객체의 기본 상태를 설정해주는 생성자 메서드 constructor()는 new에 의해 자동으로 호출되므로
클래스 상속을 사용하면 클래스를 다른 클래스로 확장할 수 있다. 기존에 존재하던 기능을 토대로 새로운 기능을 만들 수 있다는 것.먼저, 클래스 Animal 생성객체 animal과 클래스 Animal의 관계를 그림으로 나타내면 다음과 같다.또 다른 클래스 Rabbit 생
prototype이 아닌 클래스 자체에 메서드를 설정할 수도 있다. 이런 메서드를 정적(static) 메서드라고 부른다.정적 메서드는 아래와 같이 클래스 안에서 static 키워드를 붙여 만들 수 있다.User.staticMethod()가 호출될 때 this의 값은 클
OOP에서 가장 중요한 원리 중 하나는 내부 인터페이스와 외부 인터페이스를 구분짓는 것이다.실생활에 빗대어 내부 인터페이스와 외부 인터페이스 구분이 무엇을 의미하는지 알아보자커피 머신의 커버는 심플하다. 하지만 내부는 다양한 세부 요소들이 기계를 작동시키고 있다.커버는