Notice
Recent Posts
Recent Comments
Link
«   2025/04   »
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
Tags more
Archives
Today
Total
관리 메뉴

개발의변화

자바스크립트 콜백 본문

카테고리 없음

자바스크립트 콜백

refindmySapporo 2021. 9. 30. 01:48
반응형

비동기 동작을 스케줄링 할 수 있다.

setTimeout은 스케줄링에 사용되는 가장 대표적인 함수

function loadScript(src) {

let script = document.createElement('script');

script.src = src;

document.head.append(script);

}'

콜백

자바스크립트 호스트 환경 비동기 동작을 스케줄링 한다.

setTimeout은 스케줄링에 사용하는 가장 대표적인함수

 

콜백기반 무언가를 비동기적으로 수행하는 함수는 함수 내 동작이 모두 처리된 후 실행되어야 하는 함수가 들어갈 콜백 인수로 제공

중첩 콜백으로 하면 비동기적으로 연속적으로 수행 할 수 있지만 동작이 많은 경우에 좋지 않다.

 

프로미스

let promise = new Promise(function(resolve, reject) {

executor()

}):

new Promise에 전달되는 함수는 executor  , executor는 new Promise 만들어질 때 자동 실행 , 결과를 최종적으로 만들어내는 제작 코드

executror resolve,reject 자바스크립트에서 자체 제공하는 콜백, resolve와 reject를 신경쓰지 않고 executor 코드만 작성

대신 executor에선 결과를 즉시 얻든 늦게 얻든 상관없이 상황에 따라 인수로 넘겨준 콜배 하나를 반드시 호출

resolve(value) 일이 성공적으로 끝난 경우 그 결과를 나타내는 value와 함께 호출

reject(error) 에러 발생 시 에러 객체를 나타내는 error 호출

 

executor에서 결과를 즉시 얻든 늦게 얻든 상관없이 상황에 따라 인수로 넘겨준 콜백 중 하나를 반드시 호출

즉 resolve나 reject를 호출

 

생성자 new Promise가 반환하는 promise는 두 개의 내부 프로퍼티를 가질 수 있는데

state 처음에 pending(보류)였다가 resolve가 호출되면 "fulfilled", reject가 호출되면 "rejected"로 변함

result 처음엔 undefined이었다 resolve(value)가 호출되면 value로 reject(error)가 호출되면 error로 변함

 

.then

프로미스에서 가장 중요하고 기본이 되는 메서드

promise.then (

function(result)

function(error)

);

.then의 첫 번째 인수는 프라미스가 이행되었을 때 실행되는 함수, 여기서 실행 결과를 받음

.then 의 두 번째 인수는 프라미스가 거부되었을 때 실행되는 함수, 여기서 에러를 받음

 

let promise = new Promise ( function (resolve, reject) {

setTimeoout( () => resolve("done!"),1000);

promise.then (

result => alert(result),

error-> alert(error)

);

 

작업이 성공적으로 처리된 경우만 다루고 싶다면 .then에 인수를 하나만 전달

let promise = new Promise(resolve => {

setTimeout(()=> resolve("done"), 1000);

});

promise.then(alert)

 

 

catch

let promise =new Promise ((resolve,reject) => {

setTimeout(() => reject(new Error("에러 발생!")), 1000);

});

promise.catch(alert)

에러가 발생한 경우만 다루고 싶다면, .then(null, errorHandlingFunction) 같이 null을 첫 번째 인수로 전달

.catch(errorHandlingFunction) .catch .then에 null 전달하는 것과 동일하게 작동함

 

반응형