Programing/javascript

자바스크립트 실무 유틸 함수 시리즈 11 - 비동기 처리 및 Promise 관련

2025. 4. 29. 20:40
반응형

이번 11편에서는 비동기 처리와 Promise를 다룰 때 유용한 실무형 유틸 함수들을 정리합니다. 네트워크 요청, 타이머 제어, 에러 핸들링 등 비동기 작업을 보다 효율적으로 관리할 수 있습니다.


✅ 1. delay (비동기 지연)

📌 주어진 시간(ms) 만큼 지연시키는 Promise

function delay(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

📌 활용 예시

  • 테스트용 대기 시간 삽입
  • 네트워크 요청 간 지연

✅ 2. retry (재시도 로직)

📌 실패 시 최대 N번까지 재시도

async function retry(fn, retries = 3, delayTime = 1000) {
  try {
    return await fn();
  } catch (err) {
    if (retries <= 0) throw err;
    await delay(delayTime);
    return retry(fn, retries - 1, delayTime);
  }
}

📌 활용 예시

  • 네트워크 불안정 대비
  • 외부 API 호출 안정화

✅ 3. timeout (타임아웃 처리)

📌 주어진 시간 안에 완료되지 않으면 에러 발생

function timeout(promise, ms) {
  return Promise.race([
    promise,
    new Promise((_, reject) => setTimeout(() => reject(new Error("Timeout")), ms))
  ]);
}

📌 활용 예시

  • API 요청 타임아웃 설정
  • 사용자 입력 대기 시간 제한

✅ 4. allSettled Polyfill (모든 Promise 결과 수집)

📌 모든 Promise의 성공/실패 여부를 반환

function allSettled(promises) {
  return Promise.all(promises.map(p =>
    p.then(value => ({ status: 'fulfilled', value }))
     .catch(reason => ({ status: 'rejected', reason }))
  ));
}

📌 활용 예시

  • 일부 실패를 허용하는 병렬 작업 처리
  • 배치 작업 결과 수집

✅ 5. withTimeout (Promise + Timeout 결합 헬퍼)

📌 비동기 작업에 타임아웃 쉽게 적용

async function withTimeout(fn, ms) {
  return timeout(fn(), ms);
}

📌 활용 예시

  • fetch, axios 요청에 타임아웃 적용
  • 긴 작업에 실패 안전장치 추가

✅ 결론

비동기 처리 로직은 현대 웹 애플리케이션의 핵심입니다. 이번 시리즈에서 다룬 유틸 함수들을 활용하면 복잡한 비동기 흐름을 안정적이고 견고하게 관리할 수 있습니다.

반응형

'Programing > javascript' 카테고리의 다른 글

자바스크립트 실무 유틸 함수 시리즈 15 - 폼 입력 검증을 위한 유틸  (1) 2025.05.01
자바스크립트 실무 유틸 함수 시리즈 14 - 반응형 UI 구현을 위한 유틸  (0) 2025.05.01
자바스크립트 실무 유틸 함수 시리즈 13 - 프론트엔드 성능 측정을 위한 간단한 유틸  (0) 2025.05.01
자바스크립트 실무 유틸 함수 시리즈 12 - 배열 고차 함수(map, filter, reduce)  (0) 2025.05.01
자바스크립트 실무 유틸 함수 시리즈 10 - 함수형 프로그래밍(FP) 스타일  (0) 2025.04.29
자바스크립트 실무 유틸 함수 시리즈 9 - Object 객체 고급 조작  (0) 2025.04.29
자바스크립트 실무 유틸 함수 시리즈 8 - 배열 고급 조작  (0) 2025.04.29
자바스크립트 실무 유틸 함수 시리즈 7 - 문자열 정규 표현식  (0) 2025.04.29
'Programing/javascript' 카테고리의 다른 글
  • 자바스크립트 실무 유틸 함수 시리즈 13 - 프론트엔드 성능 측정을 위한 간단한 유틸
  • 자바스크립트 실무 유틸 함수 시리즈 12 - 배열 고차 함수(map, filter, reduce)
  • 자바스크립트 실무 유틸 함수 시리즈 10 - 함수형 프로그래밍(FP) 스타일
  • 자바스크립트 실무 유틸 함수 시리즈 9 - Object 객체 고급 조작
Dongkkase
Dongkkase
개발자로 일하면서 부딪히는 문제풀이가 누군가에게 도움이 되길 바라며
    반응형
  • Dongkkase
    정집사의 개발로그
    Dongkkase
  • 전체
    오늘
    어제
    • All (469) N
      • 금융 (61)
      • Programing (289) N
        • Algorithm (39)
        • API (2)
        • javascript (121)
        • CSS (8)
        • HTML (10)
        • PHP (15)
        • JAVA (27)
        • JSP (17)
        • JSP 예제 (1)
        • IOS (1)
        • Android (1)
        • Sencha Touche (1)
        • bat file, cmd (0)
        • 디버깅 (2)
        • SQL (17)
        • MS-SQL (1)
        • MySQL (12)
        • 보안 (5) N
      • Server (14)
        • Docker (1)
        • Windows (9)
        • Linux (3)
        • jeus (1)
      • Database (6)
      • IT 일반 (15)
      • 리뷰 (38)
        • Book (17)
        • 제품 (2)
        • 영화 소개 (11)
        • 음악 소개 (7)
      • 잡생각 (33) N
        • 회고 (3)
        • 컬럼 (1) N
        • 자료실 (6)
        • 낙서장 (12)
        • 위시리스트 (2)
        • WOW (1)
        • 덕 (1)
  • 인기 글

  • 최근 댓글

  • 태그

    기초
    js패턴
    SQL
    iT's MY LiFE
    IT 관련
    디자인패턴
    It
    jsp
    자바스크립트유틸
    자바
    자바스크립트
    JavaScript
    IT·컴퓨터
    사고 싶은 책
    위시리스트
    읽고 싶은 책
    IT블로그
    Java
    블로그
    php
Dongkkase
자바스크립트 실무 유틸 함수 시리즈 11 - 비동기 처리 및 Promise 관련
상단으로

티스토리툴바