FrontEnd/ES&JS 문법

[Javascript] RxJS란?

1. 개요 Nest.js에서 Microservice를 구현하면서 RxJS개념을 사용이 되어 정확하게 이해하고자 정리를 합니다. 듣기로는 Angular에서 사용되는 개념이라고 하네요(Angular를 쓸 기회가 있을지는 모르겠지만...) RxJS는 Reactive Extensions For JavaScript 라이브러리라고 해서 리액티브 프로그래밍을 javascript에서 지원하기 위해 만들어진 라이브러리입니다. 리액티브 프로그래밍이란 이벤트나 배열 같은 데이터 스트림과 전파를 중심으로 변화에 유연하게 반응하는 프로그래밍을 의미합니다. 이 리액티브 프로그래밍은 Push 시나리오 방식으로 외부와 통신합니다. *Push 시나리오 : 외부에서 명령하면서 응답이 오면 그때 반응하여 처리함. 데이터를 가지고 오기 위..

[Javascript] 클로저(Closure) 요약

정의 클로저의 정의는 클로저는 독립적인 변수를 가리키는 함수이며, 클로저 안에 정의된 함수는 만들어진 환경을 '기억한다',라고 MDN에서 정의하고 있습니다. 간단한 예제 function getClosure() { var text = 'variable 1'; return function() { return text; }; } var closure = getClosure(); console.log(closure()); // 'variable 1' 위처럼 getClosure()를 호출하면 getClosure 내부에서 선언된 변수는 사라지지 않고 제대로 된 값을 가지고 있는 것을 확인할 수 있는데, 만들어진 환경을 기억하고 있는 이 var closure 변수에 담긴 함수를 바로 클로저라고 합니다. 자세하게 클로..

[ECMAScript] Javascript ES6 Spread, Rest 정리

[ECMAScript] Javascript ES6 Spread, Rest 정리 ES6을 사용한 프로그램에서 … 이라는 기호를 많이 보게 될텐데, 이것은 Spread Operator와 Rest Parameter입니다. 레퍼런스에서는 상세하게 설명이 되어 있는데, 이런 연산자가 생소한 사람에게는 … 기호가 섞인 복잡한 코드를 보면 멘탈이 붕괴됩니다….(본인처럼) 확실하게 개념을 잡고 넘어가기 위해 쉽게 정리해보겠습니다! 1. Spread Spread 연산자는 iterable 객체를 함수의 인자, 또는 배열 literal의 요소로 확장합니다. 이 말은 즉슨 배열과 같은 여러 개의 데이터를 가진 데이터형이 있을텐데, [ , , , ]과 같이 여러 개의 콤마로 구분되는 저장소에 펼쳐서(Spread) 초기화를 해준..

[ECMAScript] Javascript ES6 기초 문법 정리

ES6 기초 문법 정리 1. Class class Car { constructor(name) { this.brand = name; } present() { return 'I have a ' + this.brand; } } const mycar = new Car("Ford"); mycar.present(); Brand라는 변수에 대해서는 따로 정의하지 않아도 적용이 된다.Class의 constructor 생성자로 파라미터를 받고 클래스를 초기화 시키는 구조. 따라서 brand를 호출하면 생성자로 초기화 했던 Ford라는 string이 출력이 된다. class Car { constructor(name) { this.brand = name; } present() { return 'I have a ' + thi..