2020.6.3 작은 쓰레기를 정리하는 ES6 promise

하나.Promise

1. Promise 대상이란 무엇인가: 미래에 발생할 어떤 사건을 대표하며, 일반적으로 비동기적인 조작을 가리킨다.
2. Promise 객체

존재하는 목적: 비동기적인 조작을 동기화된 절차로 표현하고 겹겹이 끼워진 리셋 함수(속칭 리셋 지옥)를 피한다.

작용: 비동기 리셋 해결

3. promise 객체의 세 가지 상태:

pending: 초기화 상태

fullfilled:성공상태

rejected: 실패 상태

4. promise 객체의 기본 단계를 사용합니다.

promise 실례 대상 만들기 ----->promise 대상 초기화 상태는pending

비동기 작업 수행: 타이머 켜기, aax 요청 보내기

비동기 작업 수행 결과에 따라 프로젝트 대상의 상태를 동적으로 수정합니다:resolve () 성공,reject () 실패

promise 실례 대상은 기본적으로then 방법이 있는데 두 개의 매개 변수가 필요합니다. 이 두 개의 매개 변수는 두 개의 리셋 함수

입니다.

promise 대상의 상태가 성공하거나 실패할 때then 방법의 리셋 함수를 자동으로 호출합니다

5.promise 객체 작성 후 직접 실행:

        setTimeout(() => {
          console.log("     ");
        },0);
        let promise = new Promise((resolve,reject) =>{
            console.log("   promise  ");
        });
        console.log(promise);
        console.log("      ");

6.reject의 사용
이상은promise의resolve용법에 대한 해석이다. 리소스는promise가 성공했을 때의 리셋에 해당한다. 리셋의 상태를fullfiled로 수정한다. 그러면 리셋은 실패했을 때의 리셋이다. 리셋의 상태를 리셋으로 수정한다. 그러면 우리는then에서 포착하고'실패'상황의 리셋을 실행할 수 있다.

function promiseClick(){
		let p = new Promise(function(resolve, reject){
			setTimeout(function(){
				var num = Math.ceil(Math.random()*20); //  1-10    
				console.log('       ：',num)
				if(num<=10){
					resolve(num);
				}
				else{
					reject('    10         ');
				}
			}, 2000);
		   })
		   return p
	   }
 
	promiseClick().then(
		function(data){
			console.log('resolved    ');
			console.log('        ：',data);
		}, 
		function(reason, data){
			console.log('rejected    ');
			console.log('            ：',reason);
		}
	);

위 코드:promiseClick 방법을 호출하여 실행하고 2초 후에 무작위 수를 얻습니다. 10보다 작으면 성공적입니다.resolve를 호출하여 Promise의 상태를fullfiled로 수정합니다.그렇지 않으면 우리는 '실패' 라고 생각하고, Reject를 호출하고 파라미터를 전달하는 것을 실패의 원인으로 삼는다.상태를 Rejected로 변경합니다
promiseClick을 실행하고 then에 두 개의 매개 변수를 전달했습니다. 이 두 개의 매개 변수는 각각 두 개의 함수입니다. then 방법은 두 개의 매개 변수를 받아들일 수 있습니다. 첫 번째는resolve의 리셋, 두 번째는reject의 리셋입니다.(즉then 방법에서 두 개의 리셋을 받아들일 수 있다. 하나는 성공적인 리셋 함수, 하나는 실패한 리셋 함수, 그리고 리셋 함수에서 성공한 데이터와 실패한 원인을 얻을 수 있기 때문이다) 그래서 우리는 성공과 실패가 전송된 데이터를 각각 얻을 수 있으면 위의 운행 결과가 있다.
7.catch의 사용법
Promise 대상 방법인then 방법과 병행하는 방법 중 하나는catch이다.try catch와 유사하다.catch는 이상을 포획하는 데 쓰인다.즉then 방법에서 받아들인 두 번째 파라미터인rejected의 리셋과 같다. 다음과 같다.

function promiseClick(){
		let p = new Promise(function(resolve, reject){
			setTimeout(function(){
				var num = Math.ceil(Math.random()*20); //  1-10    
				console.log('       ：',num)
				if(num<=10){
					resolve(num);
				}
				else{
					reject('    10         ');
				}
			}, 2000);
		   })
		   return p
	   }
 
	promiseClick().then(
		function(data){
			console.log('resolved    ');
			console.log('        ：',data);
		}
	)
	.catch(function(reason, data){
		console.log('catch rejected    ');
		console.log('catch            ：',reason);
	});

효과는 then의 두 번째 매개 변수에 쓴 것과 같다.이것은 10보다 큰 상황에서 리셋이 실패한 원인을 출력하지만, 리셋을 실행할 때 (즉 위 then의 첫 번째 인자) 이상을 던지면 (코드가 틀렸음) js가 잘못되지 않고, 이catch 방법에 들어간다.
8.all의 사용법
then과 같은 등급의 또 다른 방법인 all 방법은 비동기 조작을 병행하여 실행하는 능력을 제공하고 모든 비동기 조작이 끝난 후에 실행 결과가 성공할 때만 리셋을 실행한다.
9.race의 사용법
all는 모든 비동기 조작이 끝난 후에then 방법을 실행한다.race 방법은 상반된다. 누가 먼저 실행하고 완성하면 리셋을 먼저 실행한다.먼저 실행된 레이스의 성공적인 리셋이든 실패한 리셋이든 나머지는 레이스의 어떤 리셋에도 들어가지 않습니다