blocking vs non-blocking

blocking(동기)

• 즉시 시행
• 요청에 대한 결과가 동시에 일어난다(synchronous)
• 하나의 함수에서 모든걸 통제 가능

non-blocking(비동기)

• 나중에 시행
• 요청에 대한 결과가 동시에 일어나지 않는다(Asynchronous)
• 하나의 함수에서 모든걸 통제 불가능

비동기 Callback

함수안의 다른함수를 통제하기위해 callback 함수를 사용한다
다른 함수를 통제함으로써 비동기적으로 사용할 수 있다

• 모든 callback은 비동기 함수가 아니다
  비동기 가능여부는 made by design이며, 대표적인 메소드를 사용하여 표현할 수있다

대표적 비동기 메소드

• event handler, 네트워크(통신) 요청, fs module(node.js 메소드)
• setTimeout, fs.readeFile, fetch
  위와 같은 메소드 사용시 callback함수는 바동기함수로 사용된다

단점
가독성이 좋진 않다

Promise

Promise는 더욱 효율적인 비동기 처리를 위해 고안된 ES6 문법
작성 시 비동기로 작성해야 비동기의 장점을 충분히 활용할 수 있다

질문 Promise 실행함수가 가지고 있는 두 개의 파라미터 resolve 와 reject 는 각각 무엇을 의미하나?

• resolve 성공시, promise를 반환
• reject 실패시, promise를 반환

1. promise는 인자로 함수 하나를 받는다
2. 그 함수는 resolve와 reject를 인자로 받는다
3. Promise에는 then과 catch의 메소드가 있다

특이사항

• new Promise 객체는 promise를 리턴한다
• Promise.prototype.then , Promise.prototype.catch는 Promise를 리턴한다

promise 객체는 promise를 반환하기 때문에 값을 도출 하기 위해선
then(resolve) 또는 catch(reject)를 사용해야하는데,

then() 메서드
Promise를 리턴하고 두 개의 콜백 함수를 인자로 받는다
하나는 Promise가 이행했을 때, 다른 하나는 거부했을 때를 위한 콜백 함수이다

then(resolve의 인자) => {
  //성공 후 할일
  }

catch() 메서드

• The catch() method returns a Promise and deals with rejected cases only
• 에러가 났을 때 에러를 받아서 에러를 처리해준다

질문 resolve, reject함수에는 인자를 넘길 수 있습니다. 이때 넘기는 인자는 어떻게 사용할 수 있나요?

• resolve의 인자는 then 메소드를 통해 받을 수 있다
• reject의 인자는 catch 메소드를 통해 받을 수 있다

질문 new Promise()를 통해 생성한 Promise 인스턴스에는 어떤 메소드가 존재하나요? 각각은 어떤 용도인가요?

• then() , resolve의 인자를 받는다, Promise를 리턴한다
• catch(), reject의 인자를 받는다, Promise를 리턴한다

질문 Promise.prototype.then 메소드는 무엇을 리턴하나요?
질문 Promise.prototype.catch 메소드는 무엇을 리턴하나요?
두 메소드 다 Promise를 리턴한다

질문 Promise의 세 가지 상태는 각각 무엇이며, 어떤 의미를 가지나요?

• 대기(pending): 이행하거나 거부되지 않은 초기 상태
  resolve나 reject가 아직 되지 않았을때
  코드가 아직 실행되고 있는 상태
• 이행(fulfilled): 연산이 성공적으로 완료됨
• 거부(rejected): 연산이 실패함

const 프로미스인스턴스 = new Promise(프로미스실행함수)
.then => 프로미스를 리턴한다
  .then의 실행함수의 인자로 fulfilled된 결과가 전달 된다
  즉, resolve의 첫번째 인자
.catch => 프로미스를 리턴한다
  .catch의 실행함수의 인자로 rejected된 결과가 전달된다
  스크립트 실행이 중간에 멈추는 것을 막는다
  이렇게 에러를 catch하는 것을 에러핸들링이라고 한다

Promise instance => Promise를 리턴한다
resolve, reject => Promise를 리턴한다
.then, .catch => Promise를 리턴한다

이렇게 모두 Promise를 리턴하는데 Promise의 상태를 확인한다

• Promiseinstance => fulfilled : resolve인자
• Promiseinstance.then(함수) => fufilled : undefined // 값도출

에러를 then으로 받으면 Promise 상태가 rejected가되고,
catch로 받으면 Promise상태가 fulfilled로 받아올수 있다(에러핸들링)

Promise All

Promise를 여러개 처리해야 할 경우, 여러번 then도 사용가능하지만 Promise all로 대처해서 사용이 가능하다

const promiseArr = [new Promise(프로미스실행함수), new Promise(프로미스실행함수2)]
// promiseArr = [프로미스인스턴스, 프로미스인스턴스]
Promise.all(promiseArr) // Promise all 사용
promiseArr는 fulfilled상태이며, 프로미스인스턴스가 (then으로 사용한거 처럼) 해결이 된 상태로 배열에 담긴다

promiseArr는 fulfilled상태이며, 프로미스인스턴스가 (then으로 사용한거 처럼) 해결이 된 상태로 배열에 담긴다
즉 배열세트로 해결할 수 있다

Promise.all(promiseArr).then(([promiseArr의 첫번째 요소 프로미스인스턴스를 then 한 값, promiseArr의 두번째 요소 프로미스인스턴스를 then 한 값]) => {})

async, await

async 키워드를 사용한 함수 내부의

• await이 없는 경우 - fulfilled primise
• await이 있는 경우 - 결과값(resolve 인자)

const asyncFunc = async => {
  const await이 없는 경우 = new Promise(프로미스실행함수);
  const await이 있는 경우 = await new Promise(프로미스실행함수);
}

await 키워드 다음에 등장하는 함수 실행은 어떤 타입을 리턴할 경우에만 의미가 있나요?

• Promise

await 키워드를 사용할 경우, 어떤 값이 리턴되나요?
Promise의 resolve의 인자, 즉 결과값, Promise의 then을 하여 받은 값