promise(프로미스)의 개념설명과 콜백 함수 방식과 차이점

Promise란?

프로미스는 자바스크립트 비동기 처리에 사용되는 객체다. (비동기 처리의 단점을 보완하여 동기적으로 처리할수 있게끔 도와준다.) 여기서 자바스크립트의 비동기 처리란 ‘특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성’을 의미한다.

Promise가 왜 필요한가?

• 주로 서버에서 받아온 데이터를 처리할때 사용한다.
• fetch 등으로 서버에서 데이터를 요청하고 다 받아온 뒤에 처리하기 위하여 Promise를 사용한다.

promise의 장점

• promise는 .then() .catch()등 promiseAPI를 사용할수있어 코드 양을 줄이고 가독성을 증가시킬 수 있다.

promise의 3가지 상태

• pending : 대기 - 비동기 처리 로직이 아직 완료되지 않은 상태
• fulfilled : 이행 - 비동기 처리가 완료되어 프로미스가 결과 값을 반환해준 상태
• rejected : 실패 - 비동기 처리가 실패하거나 오류가 발생한 상태

콜백함수방식

callback함수는 다른 함수의 인수로 넘겨줌으로써(두번째 인자로 콜백을 넣음) 실행이 가능한 코드를 말한다.
callback을 반복적으로 실행시키기 때문에 코드의 양이 길어지고 비교적 가독성이 떨어진다.

promise, callback차이점

• callback함수는 함수안에서만 결과값처리와 결과값을 알수있지만 promise는 비동기 로직에서 처리된 결과값이 promise객체에 저장되기 때문에 로직 밖에서도 사용 가능함
• callback함수는 함수 내부에서 계속해서 연달아 호출하므로 가독성이 떨어지지만 promise함수는 promiseAPI를 사용해 가독성을 높여준다

참고: https://velog.io/@solimlee/%EA%B8%B0%EC%88%A0%EB%AC%B8%EC%A0%9C-%EB%A9%B4%EC%A0%91promise%ED%94%84%EB%A1%9C%EB%AF%B8%EC%8A%A4%EC%9D%98-%EA%B0%9C%EB%85%90%EC%97%90-%EB%8C%80%ED%95%B4%EC%84%9C-%EC%84%A4%EB%AA%85%ED%95%98%EA%B3%A0-%EC%BD%9C%EB%B0%B1-%ED%95%A8%EC%88%98-%EB%B0%A9%EC%8B%9D%EA%B3%BC-%EC%B0%A8%EC%9D%B4%EC%A0%90%EC%9D%84-%EC%84%A4%EB%AA%85%ED%95%B4%EC%A3%BC%EC%84%B8%EC%9A%94