아이템 1. 타입스크립트와 자바스크립트 관계 이해하기 타입스크립트는 문법적으로 자바스크립트의 상위집합. → 자바스크립트 프로그램에 문법 오류가 없다면, 유효한 타입스크립트 프로그램이라고 할 수 있다. → 자바스크립트 프로그램에 어떤 이슈가 존재한다면 문법 오류가 아니라도 타입 체커에게 지적당할 가능성이 높다. → 문법의 유효성과 동작의 이슈는 독립적인 문제 타입 시스템의 목표 중 하나는 런타임에 오류를 발생시킬 코드를 미리 찾아내는 것이다. → 그러나 타입 체커가 모든 오류를 찾아내지는 않음 → 타입 체커를 통과하면서 런타임 오류를 발생시키는 코드는 충분히 존재. 타입스크립트 타입 시스템은 자바스크립트의 런타임 동작을 '모델링' 한다. const x = 2 + '3'; // 정상, string const..
자바스크립트
오늘은 패스트캠퍼스에서 최근에 수강했던 김태곤님의 강의를 듣고 학습했던 내용을 정리해 보려고 한다. 시작하기에 앞서서 이 강의는 패캠에서 어떠한 대가도 제공받지 않고 직접 수강하고 내용을 정리하는 것임을 밝힌다. 정리는 강의 목차 순서대로 정리했다. 1. 정체되지 않는 프론트엔드 개발자의 일하는 방식 프레임워크를 위주로 공부하다 보면.. 따라가기 급급해진다. 내부적인 원리를 이해하지 못하면 남는 것이 없다. React, Vue는 컴포넌트 기반 개발이라는 공통점 ⇒ 이를 잘 알고 있으면 새로운 기술도 어렵지 않게 배울 수 있다. Homebrew → 패키지 매니저 for Mac VirtualBox → IE 환경 테스트 Frontend Developer : 어플리케이션이 사용자와 맞닿은 접점을 책임지는 사람 ..
지난 포스팅에 이어서 반응형 스트림의 중첩 옵저버블 처리 및 비동기 스트림에 대해 다루어 보려고 한다. 중첩 옵저버블 처리 우리는 지난 포스팅에서 스트림의 출력을 동시에 하나로 결합하는 방법을 배웠다. 조합하는 방법에 따라 옵저버블 자체에서 다른 옵저버블을 방출하기도 한다. 아래와 같은 상황을 중첩 옵저버블 구조라고 한다. 중첩 옵저버블은 특정 동작 때문에 결과를 소스 옵저버블로 반환해야 하는 후속 비동기 작업을 유발하거나 시작하는 경우에 유용하다. 지금까지는 스칼라 값을 반환하는 함수를 주로 매핑하였으나, 중첩 옵저버블은 매핑된 함수가 다른 옵저버블에 매핑된 옵저버블 또는 옵저버블의 옵저버블을 반환하는 상황을 나타낼 때 사용한다. 이러한 상황은 함수형 프로그래밍에서 빈번하게 발생하는데, 그 이유는 ma..
이번 포스팅에서는 지금까지 배웠던 RxJS 옵저버블의 기본기를 바탕으로 중첩된 옵저버블 또는 스트림 안의 스트림과 이들의 비동기 제어를 하기 위한 기능을 살펴보려고 한다. 앞선 포스팅에서 옵저버블이 시간에 따른 이벤트 시퀀스라는 개념을 다졌고, 이 옵저버블은 이벤트가 전달되고 변형되는 오케스트레이터로 생각할 수가 있다. 지금까지는 옵저버블 시퀀스를 대부분 독립적으로 처리하는 방법을 이야기 했으며, 이벤트가 언제 방출되든 상관없이 배열과 같은 방식으로 옵저버블의 모든 이벤트에 연산자를 적용하였다. 그리고 combineLatest()와 같은 RxJS 연산자를 사용하면 한 스트림에서 이벤트가 전파되어 다른 곳에서 반응을 일으킬 수 있기 때문에 RxJS와 반응형 패러다임이 빛을 발함을 알 수가 있었다. 이번 포..
RxJS 목차 Ch01. 반응형으로 생각하기 Ch02. RxJS로 배우는 반응형 프로그래밍 Ch03. 핵심 연산자 Ch04. RxJS에서의 시간 - 상 이전 포스팅의 내용에 이어서 RxJS에서 다루는 시간에 대해서 다뤄 보고자 한다. 사용자 입력 처리하기 interval()과 timer() 정적 메서드는 모두 옵저버블을 만들고 설정된 오프셋 시간 후 작업을 시작하는데 사용된다. 이들은 delay()와 함께 설정된 간격 또는 설정된 시간 후에 한 번 실행되는 미래의 작업을 스케줄링 할 때 가장 많이 사용하는 조합이다. 이 연산자는 수행할 작업을 알고 있으며 이를 나중에 실행되도록 스케줄링하려는 명시적 이벤트에 사용하기 적합하다. 그런데 만약 마우스 움직임이나 키 입력처럼 동적 이벤트 이미터에 일련의 이벤트..
이번 포스팅에서는 함수 vs 블록 스코프에 대한 비교와 호이스팅의 개념까지 정리를 해 보려고 한다. 함수 기반 스코프 스코프는 컨테이너나 바구니와 같은 구실을 하는 일련의 '버블'이고 변수나 함수 같은 확인자가 그 안에서 선언된다. 자바스크립트는 함수 기반 스코프를 사용하기 때문에 함수는 이러한 버블을 만든다. 많은 개발자들은 각각의 선언된 함수는 버블을 생성하지만, 다른 자료구조는 자체적인 스코프를 생성하지 않는다고 알고 있다. 위 예제 코드에서 foo()의 스코프 버블은 a,b,c와 bar를 포함한다. 따라서 foo() 바깥에서는 이들에게 접근할 수 없다.(접근 시 ReferenceError 발생) 하지만 foo() 안에서는 이 모든 확인자(a, b, c, foo, bar 등)에 접근이 가능하고, b..
이번 포스팅에서는 RxJS에서 시간에 대한 개념을 정리해 보고자 한다. 왜 우리가 시간을 신경써야 하는지, RxJS에서는 시간을 어떻게 처리하는지 등에 대해서 알아보고자 한다. 앞서 우리가 살펴본 바에 따르면 옵저버블은 시간 경과에 따른 이벤트의 무한 시퀀스이다. 동기적인 코드라면 실행 시간을 정확하게 측정하여 예측할 수가 있지만 비동기는 명령들이 선형적으로 실행이 되지 않기 때문에 실행 시간을 정확하게 알 수 없고 예측은 더더욱 할 수가 없다. 따라서 특정 작업이 언제 완료될지를 추측하는 것이 아닌, 작업에 반응한다는 방식으로 접근해야 한다. 왜 시간을 신경써야 할까 시간을 신경써야 하는 이유는 단순하다. 시간이 오래 걸리면 사용자는 초조함을 느끼고 결국에는 떠난다. 따라서 우리는 시간을 최대한 단축할..