[Javascript] 비동기를 동기로 Promise

• 연속되는 비동기 함수에서 콜백 지옥이 펼쳐지게 된다
• 이것을 처리할 수 있는 방법은 Promise 객체이다
• Promise 함수를 사용하면 콜백함수를 줄지어 사용하지 않아 콜백 지옥을 벗어날 수 있음
• 비동기 작업이 가질 수 있는 3가지 상태
  • Pending (대기상태)
  • Fulfilled (성공)
  • Rejected (실패)
• 상태 변경
  • Pending → Fulfilled ( resolve )
  • Pending → Rejected ( reject )
• 기본적인콜백함수

function isPositive(number,resolve, reject) {
	setTimes(() => {
	if(typeof number === 'number') {
		//성공 -> resolve
		resolve(number >= 0? "양수" : "음수")
}else {
		//실패 -> reject
	reject("주어진 값이 숫자형 값이 아닙니다");
		}
	}, 2000);
}

isPositive(
	10,
		(res) => {
			console.log("성공적으로 수행됨 : ", res);
	},
		(err) => {
			console.log("실패 하였음 : ", err);
	}
);
//성공하는 경우
//성공적으로 수행됨 : 양수

-----------------------------------------

function isPositive(number,resolve, reject) {
	setTimes(() => {
	if(typeof number === 'number') {
		//성공 -> resolve
		resolve(number >= 0? "양수" : "음수")
}else {
		//실패 -> reject
	reject("주어진 값이 숫자형 값이 아닙니다");
		}
	}, 2000);
}

isPositive(
	[],
		(res) => {
			console.log("성공적으로 수행됨 : ", res);
	},
		(err) => {
			console.log("실패 하였음 : ", err);
	}
);
//성공하는 경우
//실패 하였음 : 주어진 값이 숫자형 값이 아닙니다

• Promise 를 사용한 콜백함수

function isPositiveP(number) {
	const executor = (resolve, reject) => {
		//실행자
	
		setTimeout(() => {
		//성공 -> resolve
		if ((typeof number === "number") {
		//성공 -> resolve
		resolve(number >= 0 ? "양수" : "음수");
	} else {
		//실패 -> reject
		reject("주어진 값이 숫자형 값이 아닙니다");
		}
	}, 2000);		
};

const asynTask = new Promise(executor);
return asyncTask;
}

const res = isPositiveP(101);

res.then ((res) => {
	console.log("작업 성공 : ", res);
})
	.catch((err) => {
		console.log("작업 실패 : ",err);
});

// 작업 성공 : 양수

• Promise를 사용하는 이유

function taskA(a,b,cb) {
	setTimeout(() => {
		const res = a + b;
		cb(res);
}, 3000);
}

function taskB(a,b,cb) {
	setTimeout(() => {
		const res = a * 2;
		cb(res);
}, 1000);
}

function taskC(a,b,cb) {
	setTimeout(() => {
		const res = a * -1;
		cb(res);
}, 2000);
}

taskA(3,4,(a_res) => {
	console.log("task A : ", a_res);
	taskB(a_res) => {
		conmsole.log("task B : ", b_res);
}taskC(b_res, (c_res) => {
		console.log("task C: ", c_res);
});

// 1. task  A : 7 
// 2. task B : 14
// 3. task C : -14

-------------------------------------

function taskA(a,b) {
	return new Promise((resolve, reject) => {
	setTimeout(() => {
		const res = a + b;
		resolve(res);
}, 3000);
});
}

function taskB(a) {
	return new Promise((resolve, reject) => {
	setTimeout(() => {
		const res = a * 2;
		resolve(res);
}, 1000);
});
}

function taskC(a) {
	return new Promise((resolve, reject) => {
	setTimeout(() => {
		const res = a * -1;
		resolve(res);
}, 2000);
});
}

const bPromiseResult = taskA(5,1)
	.then(a_res) => {
	console.log("A RESULT : ", a_res);
	return taskB(a_res);
});

bPromiseRult
.then(b_res) => {
	console.log("B RESULT : ", b_res);
	return taskC(b_res);
}).then((c_res) => {
		console.log("C RESULT :", c_res);
});

// A RESULT : 5
// B RESULT : 12
// C RESULT : -12

//위와 같이 쪼개어 코드를 정리할 수도 있음
//코드 효율면에서 뛰어남
//기존의 콜백 함수를 나열한 것보다 나음