js Promise 프로미스
js Promise 프라미스
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise
-
한글 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise
- https://msdn.microsoft.com/ko-kr/library/dn802826(v=vs.94).aspx
- 호환성
- PC
- Chrome : 32
- IE : Edge , 그 미만는 전멸.
- FF : 29.0
- Opera : 19
-
Safari : 7.1
- Mobile
- 안드로이드 브라우저 : X
- Chrome : 32
- FF 29.0
- IE : X
-
Opera : X
- 공대여자 왈.
- 프로미스 : 약속하다
-
https://www.youtube.com/watch?v=JH1QflWdrdw<iframe allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/JH1QflWdrdw" width="560"></iframe>
- 동작을 미리 만들어 놓음. 다만 사용 할 때 성공(resolve),실패(reject) 함수를 설정한다.
- 따지면 콜백 2개 받는건데, 메소드 체이닝으로 선언이 가능하다.
-
x.then(xxxx).catch(yyyy)
- 이 동작은 비 동기로 실행된다.
- 즉, 다른 것과 동시 동작이 가능하다.
-
즉, 일반 함수처럼 return 값 받아서 바로 서치할 수는 없다.(그렇기에 resolve,reject 함수를 받아서 처리함)
- setTimeout 으로도 비슷하게 만들 수 있다.
- 다만 프로미스를 사용해서 만들면 좀 더 깔끔하다.
—–=——-
기본 소스 var pr1 = new Promise( function(resolve, reject){ //성공시, 실패시 동작할 함수를 받는다. //… 소스 동작 …// if(result == success){ resolve(result); }else{ reject(result); } } )
pr1.then( //resolve 함수 등록 function(val){ alert(‘처리완료! ‘+val) } ).catch( //reject 함수 등록 function(val){ alert(‘처리에러! ‘+val) } ); // 여기서 호출된다. // pr1.then 이나 pr1.catch 를 설정 “후”에 프로미스가 실행된다.(메소드 체이닝으로 설정할 때 실행되는 것이 아님.)
Promise.race
여러 프로미스 객체를 동시 실행해서 빠른 것의 결과만 사용한다.
//– https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise/race 의 예제
p2 가 p1 보다 빨리 끝난다.
Promise.race([p1, p2]).then(function(value) { console.log(value); // p2 의 값 // 모두 결정하지만 p2가 더 빠름 });
Promise.all
여러 프로미스 객체를 동시에 실행해서 전부 성공했다면 받는 받을 배열로 가져온다. 그중 하나라도 실패한다면, 실패한 하나만 reject 처리한다.
//– 코드 모양 //– https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise/all 예제 짜집기
Promise.all([p1, p2, p3]).then(function(values) { console.log(values); // [3, 1337, “foo”] }, function(reason) { console.log(reason) });