2013년 12월 16일 월요일

[튜토리얼/한글화] 자바스크립트 Promise: 또 다른 시작(JavaScript Promise: There and Back Again)

HTML5Rocks에 내리는 눈과 함께 기대했던 +Jake Archibald 의 "자바스크립트 Promise: 또 다른 시작(JavaScript Promise: There and Back Again)"이 업데이트되었습니다.
"참고로 There and Back Again은 영화 The Hobbit 3부작 중 마지막 편의 제목이기도 합니다. 뜻밖의 여정, 스마우그의 폐허는 일단 나왔으니 이어서 붙인 장난스러운 제목일지도 모르겠군요. :)"
자바스크립트의 비동기 동작으로 인해 콜백이 콜백을 부르고 다시 콜백이 콜백을 부른 과정이 중첩되다보면 내가 콜백인지 콜백이 나인지 헷갈릴 정도의 Callback Hell에 빠지게 됩니다. Promise는 이러한 비동기 동작을 손쉽게 처리할 수 있도록 고안된 비동기 프로그래밍 모델입니다.

이번 튜토리얼은 거의 작정하고 만든 듯이 완벽 해설서에 가깝습니다. Polyfill을 이용해서 당장 적용해보실 수도 있으니 비동기 콜백에 지치거나 그 지옥 한가운데에 있으시다면 잠시 코딩을 멈추시고 일단 읽어보시길 바랍니다.



TL;DR;


이 글은 브라우저의 지원 사항 및 Polyfill 소개, 다른 라이브러리와의 호환성, 복잡한 비동기 코드를 쉽게 만들기, XMLHttpRequest의 Promise화, Promise 객체의 체이닝(Chaining) 및 에러 핸들링, 병렬과 시퀀싱, Promise API 레퍼런스 등에 대해 다루며 이에 대한 예제들이 포함되어 있습니다. 지금까지 나온 Promise 관련 튜토리얼 중에 가장 자세한 내용이 아닐까 싶네요.


  • 이벤트는 비동기적인 모듈의 동작 결과를 처리하는 최고의 방법 중의 하나입니다만 콜백 형태의 호출이 꼬리를 물어가는 콜백 지옥(Callback Hell)에 빠지게 되는 것은 개발자에게는 일종의 불행과도 같습니다. Promise는 이를 순차적인(동기화)된 듯한 개발 방법을 제공합니다. 코드가 읽기 쉬워지고 콜백의 분기처리를 익숙한 순차적인 처리가 가능해지기 때문에 복잡한 콜백이 얽히는 과정에는 훌륭한 모델을 제공할 수 있습니다.
  • Promise에 대한 개념을 잡아보고 현재 브라우저 지원 상황 및 대체 라이브러리(Polyfill), 다른 라이브러리들과의 호환성을 소개합니다.
  • 실제 예제로는 복잡한 비동기 코드를 좀더 쉽게 만들기 위한 코드를 예제로 동기화된 모듈로부터 비동기화된 모듈, 그리고 최종적으로는 Promise화된 모듈의 구현 사항들을 순서대로 진행합니다.
  • 이 과정에서 Promise의 연결을 구현하는 체이닝(Chaining)과 에러 핸들링, 그리고 비동기적인 처리를 동시 수행하면서 필요한 로직을 Promise를 통해 순차적으로 처리하는 방법을 다루고 Promise API 레퍼런스를 수록하고 있습니다.


튜토리얼 링크