목록[JS,TS,Node] (13)
포도가게의 개발일지
### __proto__와 prototype property- __proto__와 prototype 프로퍼티는 동일한것을 가리킬 수 있지만 사용 주체가 다릅니다.- __proto__는 모든 객체가 가지고있으며 [[Prototype]] 내부 슬롯에 직접 접근을 할 수 있기 때문에 참조 접근하기 위하여 즉 객체가 자신의 prototype에 접근 또는 수정하기 위해서 사용되는 프로퍼티 입니다.- prototype 프로퍼티는 생성자(constructor)만 가지고 있으며 생성자 함수가 자신이 생성할 객체에 어떤 프로토타입을 할당해야하는지를 저장하기위한 목적으로 사용됩니다. ### 생성자 함수와 Prototype생성자 함수에 매번 method를 만들게 되면 중복되는 code가 매번생성되며 memory를 낭비하게..
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..