[JavaScript] 프라미스 체이닝의 에러 처리

프라미스 체이닝과 에러 핸들링을 결합하면, 비동기 작업의 순차적인 흐름을 관리하면서 발생한 에러를 체인 전체에서 한 번에 처리할 수 있습니다. 이는 특히 여러 단계의 비동기 작업을 수행할 때, 각 단계에서 발생한 에러를 분기별로 따로 처리하는 복잡함을 줄여줍니다./** * 특정 URL에서 데이터를 비동기적으로 페칭하는 함수 (fetch API 활용 가능) * @param {string} url - 데이터 요청 URL * @returns {Promise} - 페칭된 데이터를 담은 프라미스 * @throws {Error} - 네트워크 요청 실패 시 에러를 던짐 */async function fetchData(url) { return new Promise((resolve, reject) => { ..

• format_list_bulleted JavaScript
• · 2025. 2. 18.
• textsms

[JavaScript] 프라미스 체이닝

프라미스 체이닝이란비동기 작업의 결과가 순차적으로 다음 작업에 전달되도록 하는 패턴입니다.각 .then() 핸들러가 값을 반환하면, 그 값이 새로운 프라미스로 감싸져 체인의 다음 단계에 전달됩니다. 이 덕분에 여러 비동기 작업을 마치 동기적인 작업처럼 순서대로 처리할 수 있습니다.프라미스 체이닝의 기본 구조new Promise((resolve, reject) => { // 1초 후 숫자 1로 프라미스 이행 setTimeout(() => resolve(1), 1000);}) .then(result => { console.log("첫 번째 then:", result); // 출력: 1 // 이전 결과에 2를 곱하여 반환: 1 * 2 = 2 return result * 2; }) .t..

• format_list_bulleted JavaScript
• · 2025. 2. 18.
• textsms

[JavaScript] Promise를 활용한 비동기 작업

프라미스(Promise)는 비동기 작업의 완료 또는 실패와 그 결과값을 나타내는 객체입니다. 이를 통해 비동기 작업을 단순하고 직관적으로 관리할 수 있으며, 콜백 지옥(callback hell)을 피할 수 있습니다.// getUserData 함수: 사용자 ID를 받아 비동기적으로 사용자 정보를 가져옵니다.function getUserData(userId) { return new Promise((resolve, reject) => { console.log(`Fetching data for user ID: ${userId}`); // 1초 후에 작업 완료를 시뮬레이션합니다. setTimeout(() => { // 80% 확률로 성공, 20% 확률로 실패하도록 설정합니다. ..

• format_list_bulleted JavaScript
• · 2025. 2. 18.
• textsms

[JavaScript] 콜백 패턴과 비동기 처리

기본적인 콜백 패턴function fetchData(url, callback) { const xhr = new XMLHttpRequest(); xhr.open('GET', url); xhr.onload = () => { if (xhr.status === 200) { callback(null, xhr.responseText); } else { callback(new Error(`HTTP 오류 발생: ${xhr.status}`)); } }; xhr.onerror = () => { callback(new Error('네트워크 오류가 발생했습니다.')); }; xhr.send();}// 사용 예시:fetchData('https://api.exampl..

• format_list_bulleted JavaScript
• · 2025. 2. 18.
• textsms

[JavaScript] 커스텀 에러 클래스를 통한 에러 구분 및 확장

커스텀 에러 클래스 정의하기class AuthenticationError extends Error { constructor(message) { super(message); // 부모 클래스의 생성자 호출 this.name = 'AuthenticationError'; // 에러 이름 설정 }}// 사용 예시try { throw new AuthenticationError('인증 실패: 유효하지 않은 토큰입니다.');} catch (error) { console.error(error.name); // 출력: AuthenticationError console.error(error.message); // 출력: 인증 실패: 유효하지 않은 토큰입니다. cons..

• format_list_bulleted JavaScript
• · 2025. 2. 18.
• textsms

[JavaScript] 오류 처리(try catch) 및 에러 핸들러

기본적인 try...catch 사용법try 블록 내의 코드를 실행하다가 오류가 발생하면, 즉시 실행이 중단되고 제어 흐름이 catch 블록으로 넘어갑니다. catch 블록은 발생한 오류 객체를 매개변수로 받아, 오류의 상세 정보를 확인하고 처리할 수 있습니다.try { console.log("프로그램을 시작합니다."); // 존재하지 않는 함수 호출로 인해 ReferenceError 발생 undefinedFunction(); console.log("이 코드는 실행되지 않습니다.");} catch (error) { console.error("오류가 발생했습니다."); console.error("오류 이름:", error.name); console.error("오류 메시지:", error.mes..

• format_list_bulleted JavaScript
• · 2025. 2. 18.
• textsms