104%

타입스크립트에는 esmoduleinterop라는 컴파일러 옵션이 있는데 이 옵션을 켜면 Commonjs방식으로 내보낸 모듈을 es모듈 방식의 import로 가져올 수 있게 해준다. 모듈 방식이 왜이렇게 많아? ES6에 정식으로 자바스크립트에 모듈 시스템이 도입 되기 전부터 사람들은 자바스크립트 파일을 여러개로 쪼개고 다시 합치는 번들러가 필요했다. 그래서 직접 라이브러리를 만들어서 사용하곤 했는데 그때 나온 유명한 모듈 시스템들이 CommonJS와 AMD이다. 그래서 ES6에 모듈 시스템이 도입되고 나서도 구형 브라우저를 지원하기 위해 바벨로 ES6 -> ES5로 변환하고 난 다음, ES모듈을 CommonJS방식으로 트랜스파일해서 기존 번들러가 잘 동작하도록 변환하여 사용했었다. 이미 CommonJS방식..

사람은 1초에 60개의 프레임을 볼 수 있다고 한다. 그 이상의 프레임을 더 찍어내더라도 사람이 느끼기엔 거의 차이가 없다는 말이다. 그래서 자바스크립트로 애니메이션을 구현할때도 1초에 60프레임정도를 찍어내면 된다. 그 말은, 1프레임을 찍어내는데 16.6ms(1000ms / 60frame)를 넘겨서는 안된다는 말이다. 프레임이란 그냥 한장의 사진이라고 생각하면 된다. 동영상도 사실 여러장의 사진이 빠르게 움직여서 움직이는것처럼 보이는것일 뿐이다. 16.6ms마다 프레임을 찍어내기 위해 첫번째로 사용할 수 있는 방법은 setInterval이다. setInterval(function() { // animiate something }, 1000/60); 또 다른 방법은 requestAnimationFram..

ES5 까지의 자바스크립트의 원시 타입은 number, string, boolean, undefined, null, Object 뿐 이었습니다. 하지만 ES6에서 새로운 Symbol 타입이 소개되었습니다. 이 Symbol타입은 고유한 값을 만들어내기 위해 사용됩니다. 생성된 심볼을 변수에 담아놓지 않으면 접근이 불가능합니다. 또한, 객체의 key값으로 사용될 경우 private 멤버 변수 처럼 동작합니다. 자세한건 아래 내용을 살펴봅시다. symbol의 특징 열거대상에서 제외 심볼을 객체의 키로 사용하게 되면 for .. in 문으로 순회가 불가능합니다. obj2에 있는 2개의 심볼은 콘솔에 찍히지 않았습니다. 왜그렇냐면, 생성된 심볼을 변수에 담아 놓아야만 나중에 그 변수를 통해서 심볼에 접근이 가능해..