다시보는 자바스크립트 - 07

Javascript 헷갈렸던 내용, 새로 알게된 내용 정리
→ Callback

Callback지옥에 대하여

Synchronous callback : 즉각적으로, 동기적으로 실행

Asynchronous callback : 나중에, 언제실행될지 예측할 수 없는 비동기적 실행

state : 프로세스의 상태

• pending > fulfilled or rejected

producer : 데이터를 제공하는

consumer : 데이터를 소비하는

Producer

const promise = new Promise((resolve, reject) => {
  // doing some heavy work (network, read files)
  console.log('doing somthing..');
  setTimeout(() => {
    // resolve('test');
    reject(new Error('no network'));
  }, 2000)
})

// 결과
// doing somthing..

중요한건, 이렇게 Promise 생성시, 뒤에 전달한 executor라는 함수는 자동으로 즉시 실행.

Consumers : then, catch, finally

promise
  .then(value => {
    // resolve로 받은 인자값
    console.log(value); // 결과 : test
	})
	.catch(error => {
  	// reject로 받은 인자값
  	console.log(error); // 결과 : Error: no network
	})
	.finally(()=> {
  console.log('finally');
	});

만약 .then() 안에 함수를 아래와 같이 정의했다고 가정

.then(넘길변수 => 선언된함수명(넘길변수))

이렇게 then으로 받게되는 변수 하나를 그대로 함수에 넘길 때에는 다음과 같이 축약 가능

.then(선언된함수명)

async

function fetchUser() {
  return new Promise((resolve, reject) => {
    // do network request in 10 secs...
    resolve('finish');
  })
}

↓ async 방식으로 적용하면 ↓

async function fetchUser() {
	// do network request in 10 secs...
  return 'finish';
}

즉, async가 붙은 함수는 Promise객체의 resolve를 return하는 맥락