javascript

이번 포스팅에서는 자바스크립트 객체에 대해서 공부한 내용을 정리해 보려고 한다. 객체 타입 객체는 선언적(Declarative, 또는 Literal) 형식과 생성자 형식, 두 가지로 정의한다. 그리고 객체는 언어 타입(Language Types)이라 불리는 7개의 주요 타입 중 하나를 가지고 있다. null undefined boolean number string object symbol(ES6에서 추가) 참고로 여기에서 단순 원시타입(Simple Primitives) 5개(string, number, boolean, null, undefined)는 객체가 아니다. 그리고 복합 원시타입(Complex Primitives)이라는 독특한 객체 하위 타입도 존재한다. 예를 들면 function 타입이 여기에 ..

오늘은 자바스크립트에서 많은 개발자들이 헷갈려하는 this 키워드에 대해서 확실하게 짚고 가보려고 한다. 많은 개발자들은 this를 다음 두 가지 의미로 많이 생각한다. 함수 그 자체를 가리킴 함수의 스코프(scope)를 가리킴 결론적으로 둘 다 올바른 의미로 이해한 것은 아니다. 하나씩 설명해 보려고 한다, 자기 자신으로의 this 함수가 내부에서 자기 자신을 가리킬 일이 언제 있을까? 재귀 로직이 들어가는 경우도 있고 최초 호출 시 이벤트에 바인딩 된 함수 자신을 언바인딩 할 때도 자기 참조가 필요하다. 아래의 코드는 함수가 this로 자기 참조를 할 수 없다는 것을 보여주는 예제이다. foo.count = 0을 하면 foo라는 함수 객체에 count 프로퍼티가 추가된다. 하지만 this.count에..

JavaScript ES6에서 기존의 ES5와 비교해 보았을 때 많은 변화가 생겼다. 그 중의 하나는 ES6에서 컴포넌트 정의를 위한 모듈 형태를 지원한다는 것이다. 이 과정에서 기존의 자바스크립트에서 모듈을 정의한 방법인 AMD, CommonJS와는 다른 방식으로 모듈을 사용하게 되었다. 바로 import/export 문을 통해서 언어 내부적으로 자바스크립트 모듈 의존성을 지원하게 된 것이다. 이 글은 (과거의 나처럼) 기존의 CommonJS 방식의 require로 모듈을 불러오는 방식과 ES6의 import로 모듈을 불러오는 방식을 혼동하는 사람들을 위해서 작성하게 되었다. 먼저 기존의 CommonJS 방식의 모듈 사용 방식과 비교해 보았을 때 ES6 방식이 가진 장단점을 살펴보고 가자. ES6 방식..