프로그래밍 공부 노트

Promise.all 여러개의 프로미스를 동시에 실행시키고 모든 프로미스가 완료된 후 데이터를 처리할 때 사용한다. 사용법 let promise = Promise . all ([... promises ...]); Promise . all ([ new Promise (( resolve ) => setTimeout (() => resolve ( 1 ), 3000 )), new Promise (( resolve ) => setTimeout (() => resolve ( 2 ), 2000 )), new Promise (( resolve ) => setTimeout (() => resolve ( 3 ), 1000 )), ]). then ( console . log ); // 프라미스 전체가 처리되면 [1, 2, 3]이 반환된다. 각각의 프라미스는 배열 구성 요소가 된다. 배열안에 작성한 프로미스가 모두 처리된 후 새로운 프로미스가 이행되며 배열안에 작성한 프로미스의 결과 값들을 담은 배열이 새로운 프로미스로 반환된다. Promise.all은 특이한점이 있는데 위 예시에서 볼 수 있듯이 Promise.all의 배열안에 작성한 프로미스들은 처리되는 순서와는 상관없이 작성한 순서대로 값을 반환한다.  Promise.all은 아래와 같이도 사용될 수 있다. let urls = [ "https://api.test1.com/users/lee" , "https://api.test2.com/users/kim" , "https://api.test3.com/users/park" , ]; // fetch를 사용하여 url을 프라미스로 매핑한다. let requests = urls . map (( url ) => fetch ( url )); console . log ( requests ); // [Promise, Promise, Promise] //...

async / await 을 사용하면 프로미스(Promise)를 좀 더 편리하게 사용할 수 있다. async / await 는 프로미스(Promise) 코드를 보다 간편하고 직관적으로 작성할 수 있게 해주는 API 이다.   async 함수 function 앞에 async 키워드를 작성하면 해당 함수는 프로미스(Promise)가 된다. const asynchronous = async () => { return "something" ; }; 기존의 프로미스 방식에서는 resolve 콜백함수와 reject 콜백함수를 인자로 받아오는 콜백함수를 선언했어야 했다. 하지만 async 키워드를 작성하면 프로미스(Promise)의 콜백함수를 작성하지않아도 해당 함수는 항상 프로미스를 반환하게 된다.  만약 프로미스가 아닌 값을 반환하더라도 이행된 상태의 프로미스로 값을 감싸 이행된 프로미스를 반환해야한다. const asynchronous = async () => { return "something" ; }; asynchronous (). then ( console . log ); // something 위 예시 asynchronous 함수를 호출하면 아래의 사진과 같이 이행된 프로미스 "something"이 반환된다. 이 처럼 함수 앞에 async 키워드가 작성되면 이행된(fulfilled) 프로미스가 반환된다. async 키워드를 사용하면 기존의 .then() 대신에 await을 사용할 수 있다. await await은 영어 단어 뜻 "기다리다" 와 동일하게 동작한다.즉 프로미스가 처리될 때까지 함수 실행을 기다리게 된다. 그리고 처리된 결과를 가지고 코드를 이어서 실행한다. 프로미스가 처리되는 동안에 다른 업무(다른 스크립트 실행, 이벤트 처리 등)을 할 수 있다. await은 async 함수 안에서만 동작한다. async 키워드를 사용하지 않은 함수에서 aw...

프로미스 ( Promise) 란  내용이 실행은 되었지만 결과를 아직 반환하지 않은 객체이다. 프로미스(Promise)는 자바스크립트 비동기 처리에 사용되는 객체이다. 비동기 처리란 순서대로 동작하는것이 아닌 오래 걸리는 작업은 뒤에서 따로 수행하면서 그동안 뒤에있는 작업들을 순서대로 수행하는 자바스크립트의 특성을 말한다. 프로미스는 보통 API를 통해 서버에서 데이터를 받아오거나 파일을 읽어오는 등의 역할을 수행하기 위해서 사용된다. 프로미스는 기본적으로 아래와 같이 작성한다. let promise = new Promise (( resolve , reject ) => { // executor }); new Promise에 전달되는 콜백 함수는 executor(실행자, 실행 함수)함수라고 부른다. new Promise를 만들면 콜백 함수인 executor 함수는 자동적으로 즉각 실행되는데, executor 함수 내부에서 원하는 일(비동기 작업)을 처리할 수 있다. 이러한 콜백함수 executor는 항상 resolve 콜백 함수와 reject 콜백 함수를 받는다. 이 함수들은 프로미스 객체를 선언하면 자동으로 생성되므로 따로 선언하지 않아도 된다. executor를 실행하고 결과를 즉시 얻든, 늦게 얻든 상관없이 인자로 넘겨진 resolve, reject 콜백 함수 중 하나를 반드시 호출해야 한다. 두 콜백 함수는 사용방법을 보면 resolve(value) 콜백 함수는 일이 성공적으로 처리된 경우 그 결과인 프로미스를 value로 전달하고 reject(error) 콜백 함수는 에러가 발생하면 에러 객체를 error로 전달한다. 즉 비동기적으로 작업을 수행하고 처리 결과에 따라 성공시 resolve를 실패시 reject를 호출한다. 프로미스를 사용하려면 state 상태에 대해서도 알아야한다. promise 상태 변화 promise 객체는 내부 프로퍼티를 갖고있는데 state 와 result 를 프러퍼티로 갖는다. state는 처음에 ...