그전에는 요청을 기다리고 사용하는 것이 없었기에 콜벡 함수를 썼다.
const myCallback = () => { const aa = new XMLHttpRequest(); aa.open("get", "http://numbersapi.com/random?min=1&max=200"); aa.send(); aa.addEventListener("load", (res) => { console.log(res); // API 요청 결과 const num = res.target.response.split(" ")[0]; // 65 (랜덤 숫자) const bb = new XMLHttpRequest(); bb.open("get", ` https://koreanjson.com/posts/${num}`); bb.send(); bb.addEventListener("load", (res) => { console.log(res); // API 요청 결과 const userId = JSON.parse(res.target.response).UserId; // 문자열을 객체로 바꾸고 싶기에) const cc = new XMLHttpRequest(); cc.open("get", `https://koreanjson.com/posts?userId=${userId}`); cc.send(); cc.addEventListener("load", (res) => { console.log(res); // 최종 API 요청 결과 }); }); }); };
const myPromise = () => { axios.get(`http://numbersapi.com/random?min=1&max=200`).then((res) => { return axios .get(`http://numbersapi.com/random?min=1&max=200`) .then((res) => { return axios.get(`http://numbersapi.com/random?min=1&max=200`); }) .then((res) => { // res 최종 결과 }); }); };
const myAsyncAwait = async () => { await axios.get(`http://numbersapi.com/random?min=1&max=200`); await axios.get(`http://numbersapi.com/random?min=1&max=200`); await axios.get(`http://numbersapi.com/random?min=1&max=200`); };