Frank의 공부 일지

Request 객체는 API를 컨트롤하기 위한 메소드를 3개 담고 있는데 - param - query - body 1. req.param : 주소에 포함된 변수를 담는다. 예를 들어 https://yunbo96.tistory.com/post/12345 라는 주소가 있으면 12345를 담는다. 2. req.query : 주소 바깥 , ? 이후의 변수를 담는다. 예를 들어 https://yunbo96.tistory.com/post?nickname=hi 일 경우 hi를 담는다. 3. req.body : XML, JSON, Multi-Form 등의 데이터를 담는다. 당연히 주소에선 확인할 수 없다. 요청 본문에 제출된 키-값 데이터 쌍을 포함한다. req.body는 body-parser를 사용하기 전에는 def..

모듈이 필요한 이유 1. 코드베이스를 나누어 여러 파일로 분할해서 코드를 좀 더 구조적으로 관리. 각각의 독립적인 기능의 조각들을 개발 및 테스트하는데 도움. 2. 다른 프로젝트에 코드를 재사용 가능 3. 은닉성을 제공 4. 종속성을 관리. 필요한 일련의 종속성들을 쉽게 임포트. CommonJS 내부와 모듈 패턴 CommonJS는 Node.js의 첫 번째 내장 모듈 시스템입니다. CommonJS 명세의 두 가지 주요 개념을 요약하면 다음과 같습니다. - require는 로컬 파일 시스템으로부터 모듈을 임포트하게 해줍니다. - exports와 module.exports는 특별한 변수로서 현재 모듈에서 공개될 기능들을 내보내기 위해서 사용됩니다. module.exports vs exports 많은 사람들이 ..

Promise.all - 여러 개의 프라미스를 동시에 실행시키고 모든 프라미스가 준비될 때까지 기다린다고 해봅시다. - 복수의 URL에 동시에 요청을 보내고, 다운로드가 모두 완료된 후에 콘텐츠를 처리할 때 이런 상황이 발생합니다. - Promise.all은 이럴 때 사용할 수 있습니다. let promise = Promise.all([...promises...]); Promise.all 은 요소 전체가 프라미스인 배열(대개는 배열)을 받고 새로운 프라미스를 반환합니다. 배열 안 프라미스가 모두 처리되면 새로운 프라미스가 이행되는데, 배열 안 프라미스의 결괏값을 담은 배열이 새로운 프라미스의 result가 됩니다. 아래 Promise.all 은 3초 후에 처리되고, 반환되는 프라미스의 result는 배열..

자바스크립트 호스트 환경이 제공하는 여러 함수를 사용하면 비동기 동작을 스케줄링 할 수 있습니다. 원하는 때에 동작이 시작하도록 할 수 있습니다. setTimeout은 스케줄링에 사용되는 가장 대표적인 함수입니다. 실무에서 맞닥뜨리는 비동기 동작은 아주 다양합니다. 스크립트나 모듈을 로딩하는 것 또한 비동기 동작입니다. src에 있는 스크립트를 읽어오는 함수 loadScript(src)를 예시로 비동기 동작 처리가 어떻게 일어나는지 살펴보면 function loadScript(src) { // 태그를 만들고 페이지에 태그를 추가합니다. // 태그가 페이지에 추가되면 src에 있는 스크립트를 로딩하고 실행합니다. let script = document.createElement('script'); scrip..

개발을 하다 보면 자체 에러 클래스가 필요한 경우가 종종 있다. 네트워크 관련 작업 중 에러는 HttpError, 데이터베이스 관련 작업 중 에러는 DbError, 검색 관련 작업 중 에러가 발생했다면 NotFoundError를 사용하는 것이 직관적이다. 직접 에러 클래스를 만든 경우, 이 에러들은 message나 name, 가능하다면 stack 프로퍼티를 지원해야 한다. HttpError 클래스의 객체에 statusCode 프로퍼티를 만들고 404나 403, 500 같은 숫자를 값으로 지정할 수 있을 것이다. Error를 상속받아 커스텀 에러 클래스를 만들게 되면 obj instanceof Error를 사용해서 에러 객체를 식별할 수 있다는 장점이 있다. 애플리케이션 크기가 점점 커지면 우리가 만들게 ..

에러가 발생하면 스크립트는 즉시 중단되고, 콘솔에 에러가 출력된다. 그러나 try..catch 문법을 사용하면 스크립트가 중단되는 걸 방지하고, 에러를 잡아서(catch) 더 합당한 무언가를 할 수 있게 된다. try..catch는 오직 런타임 에러에만 동작 - try..catch는 실행 가능한 코드(유효한 자바스크립트 코드)에만 동작한다. try..catch는 동기적으로 동작 - setTimedout처럼 '스케줄 된' 코드에서 발생한 예외는 try..catch에서 잡아낼 수 없다. 에러 객체 에러가 발생하면 자바스크립트는 에러 상세내용이 담긴 객체를 생성하고 그 후 catch 블록에 이 객체를 인수로 전달한다. try{ // ... } catch(err){ -> '에러 객체', err 대신 다른 이름으..

자바스크립트의 this는 다른 프로그래밍 언어의 this와 동작 방식이 다르다. 자바스크립트에선 모든 함수에 this를 사용할 수 있다. function sayHi(){ alert(this.name); } this 값은 런타임에 결정된다.(컨텍스트에 따라 달라진다.) 동일한 함수라도 다른 객체에서 호출했다면 this가 참조하는 값이 달라진다. let user = { name: "John" }; let admin = { name: "Admin" }; function sayHi(){ alert(this.name); } //다른 두 객체에서 동일한 함수 사용 user.f = sayHi; admin.f = sayHi; //this는 점(.) 앞의 객체를 참조하기 때문에 this 값이 달라진다. user.f();..

ECMAScript 코드에서 문제점을 검사하고 일부는 더 나은 코드로 정정하는 린트 도구 중의 하나. * 린트: 소스 코드에 문제가 있는지 탐색하는 작업을 도와주는 소프트웨어 도구를 의미. 코드의 가독성을 높이고 잠재적인 오류와 버그를 제거해 단단한 코드를 만드는 것이 목적. 코드에서 검사하는 항목 - 포매팅 - 코드 품질 설치 및 사용법 npm i -D eslint //.eslintrc.js module.exports = { env: { es6: true, node: true, }, extends: "eslint:recommended", globals: { Atomics: "readonly", SharedArrayBuffer: "readonly", }, parserOptions: { ecmaVersio..

promise 객체를 좀 더 쉽게 다룰 수 있게 고안된 문법. async 기본 예제 async function greet() { return 'hello'; } greet().then(console.log); async 함수에서는 promise가 아닌 값을 리턴하더라도 resolved promise가 반환된다. await 기본 예제 function greet() { return new Promise(function(resolve){ setTimeout(function() { resolve('hello'); }, 1000); }); } (async function() { var result = await greet(); //resolved 될 때까지 대기 console.log(result); })(); 1..

자바스크립트 비동기 작업의 최종적인 결과(또는 에러)를 담고 있는 객체. 작업 결과에 따라 성공 또는 실패를 리턴하며 결과 값을 전달받을 수 있습니다. * 비동기 처리 - 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성 promise의 3가지 상태 및 처리 흐름 - pending(대기): 처리가 완료되지 않은 상태 - fullfilled(이행): 성공적으로 처리가 완료된 상태 - rejected(거부): 처리가 실패로 끝난 상태 이행(fullfillment) 값이나 거부(rejection)와 관련된 에러(원인)를 받기 위해 프라미스 인스턴스의 then() 함수를 사용할 수 있습니다. promise.then(onFulfilled, onRejected) prom..