동기 3

Javascript - Callbacks, ES6 Promise, Async, Await

자바스크립트는 싱글스레드이다. 그래서 하나의 일을 할 때, 하나밖에 못하는데, 만약 그 하나의 일이 오래 걸리는 일이면 어떻게 될까? 그 하나의 일이 오래걸리기에 다른 직업들은 그 하나의 일이 끝날때 까지 기다려야 한다. → 이러한 문제점을 해결하기 위해서 비동기로 어떠한 일을 수행하게 된다. ※ 만약 비동기 요청이 여러 개 있을 때, 하나의 요청이 다른 요청의 결과에 의존한다면? (예를 들어, 요청1의 응답을 이용해서 요청2를 수행해야 한다면?) 아래 코드에서처럼 둘 다 비동기 요청을 보내는데, 두 번째 요청이 첫 번째 요청의 결과가 필요할 수가 있다. 하지만, 둘 다 병렬적으로 요청을 보내기 때문에, response1을 가지기 전..

Javascript 중급 - 1) this, bind, call, apply, 동기/비동기, call stack, call back

- this 키워드는 여러상황에서 각기 다른 것들을 참조한다. 1) 메소드에서 this 를 사용하면, 해당 객체를 가리킨다(참조한다) // // Method => object const audio = { title: 'ALLU', play() { console.log('play this', this); } } audio.play(); audio.stop = function () { console.log('stop this', this) } audio.stop(); 2) 함수에서 this를 사용하면, window 객체를 가리킨다. // Function => Window Object function playAudio() { console.log(this); } playAudio();..

Javascript 에서 forEach 함수는 비동기함수를 기다리지 않아요!

🚨 문제 상황 배열에 담긴 요소들을 하나씩 뽑아내는 작업을 할 때 아래와 같은 코드가 있다고 해보자. const allu = new Array(10).fill('dachshund'); const result = [] const asyncFunction = (i) => { return new Promise(resolve => { setTimeout(() => { result.push(i) resolve() }, 1000); }) } allu.forEach(async (_,i)=>{ await asyncFunction(i) }) console.log(result) 위 코드처럼 작성하면 result 값에 원하던 값이 들어가있지 않고 초기의 배열인 빈값이 출력됐다. forEach는 내부에 들어있는 순차적으로배열..

반응형