비동기3 비동기 처리 AJAX , XMLHttpRequest AJAX (Asynchronous Javascript And XML) 페이지 새로고침 없이 서버에 요청 서버로부터 데이터를 받고 작업을 수행 axios, fetch, async/await, promise, XMLHttpRequest, superagent, request fetch Request, Resonse와 같은 HTTP의 파이프라인 구성 요소 조작가능 var myImage = document.querySelector('img'); fetch('flowers.jpg') .then(function(response) { return response.blob(); }) .then(function(myBlob) { var objectURL = URL.createObjectURL(myBlob); myImage.. 2020. 12. 19. Promise 프로미스 사용하기 Promise 프로미스는 비동기 작업의 최종 완료 또는 실패를 나타내는 객체, 콜백을 첨부하는 방식의 객체이다. 프로미스 장점 콜백은 자바스크립트 Event Loop이 현재 실행중인 콜 스택을 완료하기 이전에는 절대 호출되지 않는다. 비동기 작업이 성공하거나 실패한 뒤에 then() 을 이용하여 추가한 콜백의 경우에도 위와 같다. then() 을 여러번 사용하여 여러개의 콜백을 추가 할 수 있으며 각각의 콜백은 주어진 순서대로 하나 하나 실행되게 된다. chaining Promise.then() then() 메서드는 Promise를 리턴하고 두 개의 콜백 함수를 인수로 받는다. 하나는 Promise가 이행했을 때, 다른 하나는 거부했을 때를 위한 콜백 함수이다. const promise1 = new Pr.. 2020. 9. 23. 비동기 Asynchronous 이해하기 Asynchronous 비동기 보통 코드는 한번에 한가지 사건만 발생하면서 순차적으로 진행된다. 만약 어떤 함수의 결과가 다른 함수에 영향을 받는다면, 그 함수는 다른 함수가 끝나고 값을 산출할 때까지 기다려야 한다. 그리고 그 과정이 끝날 때 까지, 유저의 입장에서 보면, 전체 프로그램이 모두 멈춘 것처럼 보이게 된다. 기다리는 동안 다른 작업을 수행할 수 있는것, 이것이 비동기 프로그래밍의 기본이다. Blocking code 웹 앱이 브라우저에서 특정 코드를 실행하느라 브라우저에게 제어권을 돌려주지 않으면 브라우저는 마치 정지된 것처럼 보일 수 있다. 이러한 현상을 blocking 이라고 부른다. Threads 쓰레드는 기본적으로 프로그램이 작업을 완료하는데 사용할 수 있는 단일 프로세스이다. 각 스.. 2020. 9. 23. 이전 1 다음