일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
Tags
- 개인앱
- Postman
- 알고리즘
- SwiftUI
- Swift
- 리액트입문
- git
- RxSwift
- 글또
- iOS개발
- 글또9기
- 회고
- Swift알고리즘
- ios
- 12회차
- UIKit
- 수정중
- JavaScript
- 초보iOS개발자
- 글또x코드트리
- 개발회고
- 유데미
- 클린코드
- 글쓰기
- ViewBuilder
- 스유
- 왕초보
- 글또10기
- github
- 비동기
Archives
- Today
- Total
playground_avec coding
[Javascript] await / async 에 대해..(비동기 처리) 본문
//async & await
//clear style of using promise
//1. async
async function fetchUser(){
//do network request in 10 secs..
return 'beshyun';
}
const user = fetchUser();
user.then(console.log);
console.log(user);
//2. await ✨
function delay(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
async function getApple(){
await delay(2000);
return '🍎';
}
async function getBanana(){
await delay(1000);
return '🍌';
}
//프로미스도 중첩되면 콜백지옥을 연상케 됨.
//병렬적 await > 동시다발적 실행
async function pickFruits(){
const applePromise = getApple(); //Promise 안에 있는 코드블럭 실행 각각 시키고
const bananaPromise = getBanana();
const apple = await applePromise; //await > 동기화 시켜줌..
const banana = await bananaPromise;
return `${apple} + ${banana}`;
}
pickFruits().then(console.log);
//3. useful APIs ✨
function pickAllFruits(){//Promise 에 있는 all APIs
return Promise.all([getApple(), getBanana()]).then(fruits =>
fruits.join(' + ')//배열을 스트링으로 묶을 수 있는 join
);
}
pickAllFruits().then(console.log);
function pickOnlyone(){
return Promise.race([getApple(),getBanana()]);
}
pickOnlyone().then(console.log);
'front-end > JavaScript' 카테고리의 다른 글
[JavaScript] CSS 변수 사용과 JS (0) | 2021.08.22 |
---|---|
[JavaScript] event는 어떻게 호출˙발생하고, 어떻게 막지? (0) | 2021.07.08 |
[JavaScript] strict Mode(엄격모드) 라고 아십니까? (0) | 2021.07.06 |
[Javascript ] 콜백함수 남용에 대한 위험성.. (0) | 2021.07.06 |
[JavaScript] 웹 브라우저에 무슨 일이 ?? What happened to web Browser? (0) | 2021.07.05 |