포도가게의 개발일지

RxJS? - 이벤트 기반 프로그래밍에서 함수형 프로그래밍을 이용해 보다 선언적으로 이벤트를 처리할 수 있도록 도와준다? - RxJS는 모든 이벤트를 observable로 추상화하여 시간에 따른 스트림으로 간주할 수 있게 된다. 그리고 각 이벤트가 observer(이벤트 핸들러)에게 전달되기 전에 map, filter 등의 operator를 이용해 이벤트를 필요한 형태로 재가공하여 observer에게 전달할 수 있다. 일반적인 이벤트 처리 방식 document.addEventListener('click', () => console.log('Clicked')); RxJS 방식 import { fromEvent} from 'rxjs' //fromEvent를 이용하여 observable 객체로 만든다. con..

Intersection vs union type Union type check interface Bird { fly(): void; layEggs(): void; } interface Fish { swim(): void; layEggs(): void; } declare function getSmallPet(): Fish | Bird; let pet = getSmallPet(); pet.layEggs(); // Only available in one of the two possible types pet.swim(); Property 'swim' does not exist on type 'Bird | Fish'. Property 'swim' does not exist on type 'Bird'. inters..

pipe() : pipe 함수는 함수로 인자를 받아 함수들을 합성해 하나의 함수를 리턴한다., 받은 함수들을 연속적으로 실행해주는 함수를 리턴하는 함수 const pipe = (...funcs) => arg => funcs.reduce((a, f) => f(a), arg); // 위에서부터 차례대로 return하여 다음 함수에 영향을 줌 const p = pipe( a => a + 1, a => a + 10, a => a + 100 ); console.log(p(0)); // 111 Class-transformer 설치 $ yarn add class-transformer $ yarn add reflect-metadata plainToClass method import moment = require('mo..

Node.js - Node.js는 C++로 작성된 런타임이고 그 내부에 V8 Engine를 가지고 있다. 그 덕분에 크롬과 같은 브라우저에서 실행하던 자바스크립트를 로컬에서 실행할 수 있다. 그런데 그 내부에는 V8 Engine 말고도 libuv 라는 라이브러리가 존재한다. - Node.js를 싱글 스레드 논 블로킹(제어권을 넘기지 않고 가지고 있는다.)이라고 한다. 또한 싱글 스레드로 작동하므로 I/O같은 작업은 비동기적(작업이 완료되었는지 여부를 확인하지 않고 callback처리한다.)으로 처리해야 한다. event loop에 멈춤이 없어야 한다(Node.js 최대한 모든 작업을 비동기하게 처리해야 한다.) libuv - libuv란 C++로 작성된, Node.js가 사용하는 비동기 I/O 라이브러리..

생성자 함수 // 함수가 new를 만나면 // 생성자 함수 동작원리 function User(name,age){ // this라는 객체 생성 this = {}; this.name = name; this.age = age; // return 추가 return this; } Closure 코드가 실행될 때 전역 렉시컬 환경이 생성됨 또한, 함수가 실행될때 내부 렉시컬 환경이 생성된다. 함수가 생성될 당시 외부 함수에 변수를 기억하기 때문에 외부함수가 소멸 되었다 하더라도 내부함수는 외부함수에 변수에 접근 할 수 있다. 변수를 참조 할 때는 내부에서 점점 외부를 참조하게되고 마지막으로 전역 렉시컬을 참조한다. function Adder(x){ return function(y){ return x+y; } } /..

호이스트(hoisting) function getX() { console.log(x); // undefined var x = 100; console.log(x); // 100 } getX(); // error가 안나는 이유는 JS는 호이스팅을 통해 선언과 할당부를 나누게 된다. ->호이스팅 되어 아래처럼 바뀌게 된다. function getX() { var x; console.log(x); // undefined x = 100; console.log(x); // 100 } getX(); 함수 선언문 vs 함수 표현식 - 함수는 함수 이름으로 호출되는게 아니라 식별자를 통해 호출 된다. - 함수 선언문에 경우 암묵적으로 함수이름을 가진 식별자를 함수가 포함된 스코프에 암묵적으로 생성한다. // 함수 포현식..

V8 엔진이란? - Google에서 만든 JavaScript 컴파일러로 C++언어를 기반으로 만들어 졌습니다. 때문에 독립적으로 실행이 가능하며, 다른 웹 브라우저 없이 JavaScript, Node.js 코드를 컴파일 할 수 있습니다. 1. V8은 JS파일을 파서(Parser)에게 넘긴다. 2. 파서는 js파일을 분석하고 파싱하여 AST로 변환하게 된다. * AST는 컴파일러에서 널리 사용되는 자료 구조인데, 우리가 일반적으로 작성한 소스 코드를 컴퓨터가 알아먹기 쉽게 구조화한다고 생각하면 된다. function hello (name) { return 'Hello,' + name; } // 해당 자바스크립트를 파싱하여 AST로 변환하게 되면 아래와 같은 구조로 바뀐다. { type: 'FunctionD..

1. 자바스크립트 - 우선, 자바스크립트는 싱글 스레드(single threaded) 프로그래밍 언어이다. 싱글 스레드라는 건, 한 번에 하나의 call stack을 갖고 있고, 그 말은 다시 말해 한 번에 하나씩만 일 처리를 할 수 있다는 말 2. 자바스크립트의 메모리 구조 자바 스크립트의 메모리 구조는 크게 Heap memory, CallStack Task Queue로 생각해 볼 수 있습니다. 각 영역에서는 무슨 일을 담당하고 이루어질까요? 자바스크립트의 동작은 아래 그림을 통해서 간략하게 알아볼 수 있습니다. 메모리힙 메모리 할당이 동적으로 일어나는 곳 배열을 생성하거나 객체를 생성할 때. 즉, 원시값을 제외한 메모리에 주소값이 할당되어 참조를 해야되는 경우에는 모두 힙에 저장이 된다. Call S..