ES6 의 Promise 와 비동기 프로 그래 밍 을 깊이 이해 하 다.

9198 단어 jsES6 깊이 이해
ES6 의 var, let, const 의 차 이 를 깊이 이해 하고 ES6 의 함 수 를 깊이 이해 하 며 ES6 의 대상 을 깊이 이해 하 는 등 ES6 의 구 조 를 깊이 이해 하고 ES6 의 모듈 을 깊이 이해 합 니 다.
1: 비동기 프로 그래 밍 배경:
JS 엔진 은 단일 스 레 드 이벤트 순환 이라는 개념 에서 js 엔진 은 같은 시간 에 코드 만 실행 할 수 있 고 코드 가 실 행 될 때마다 작업 대기 열 에 추 가 됩 니 다.JS 엔진 이 현재 코드 의 실행 을 마치 면 이벤트 순환 은 대기 열의 다음 작업 을 수행 합 니 다.작업 은 대열 의 첫 번 째 부터 마지막 까지 실 행 됩 니 다.이전에 보편적으로 사 용 했 던 비동기 방식 은 리 셋 모드 였 다.이런 모델 은 잘 작 동 하지만 너무 많이 끼 워 넣 으 면 귀 찮 을 수 있다.
     methcod1(function(err,result){
            if(err){
                throw err;
            }
            mothod2(function(err,result){
                if(err){
                    throw err;
                }
                mothod3(function(err,result){
                    if(err){
                        throw err;
                    }
                    mothod4(function(err,result){
                        if(err){
                            throw err;
                        }
                        mothod5(result);
                    })

                })
            })
        })

상술 한 예 에서 리 셋 은 복잡 한 코드 를 만들어 이해 하기 어렵다.
2. Promise 기초:
Promise 에 지옥 으로 돌아 가 는 문 제 를 해결 할 수 있 는 문제 가 생 겼 다.
promise 는 하나의 약속 이다. js 는 미래 어느 순간 에 결 과 를 되 돌려 주 겠 다 고 약속 했다.
Promise 사용 1: promise 구조 함수 로 새 promise 만 들 기
new Promise(function(resolve,reject){
setTimeout(()=>{resolve(10)},100)}).then(v=>console.log(v))//10

2: 결 정 된 Promise 를 만 들 수 있 습 니 다.
 Promise.resolve(5).then(v => console.log(v)) // 5
 Promise.reject(5).catch(v => console.log(v)) // 5

3: catch 를 통 해 이상 포착
   new Promise(function(resolve, reject) {
        if(true) {
           throw new Error('error!!')
        }
    }).catch(v => console.log(v.message)) // error!!

4: promise 체인 호출
     new Promise((resolve, reject) => {
            if (xxx) {
                resolve("haha");
            } else {
                reject("this is wrong")
            }
        }).then((value) => {
            return "Hi " + value
        }).then((value) => {
            return " welcome!"
        }).catch((err) => {
            console.log(err.message)
        })

5: Promise. all () 방법: 하나의 배열 을 매개 변수 로 받 아들 이 고 그들 이 모두 완성 한 후에 돌아 오 는 Promise 만 이 완 료 됩 니 다.
 //       
    Promise.all([
            new Promise(((resolve, reject) => resolve(1))),
            new Promise(((resolve, reject) => resolve(2))),
            new Promise(((resolve, reject) => resolve(3))),
        ]).then(arr=>{
            console.log(arr)//[1,2,3]
        })

6: Promise. race () 방법 은 Promise. all 과 유사 하 다. Promise. race 는 하나의 promise 가 해결 되면 Promise. race 가 돌아온다.
  //      promise    
     Promise.race([
            new Promise(((resolve, reject) => {
                setTimeout(()=>{resolve(1)},1000)
            })),
            new Promise(((resolve, reject) => {
                setTimeout(()=>{resolve(1)},2000)
            })),
            new Promise(((resolve, reject) => resolve(3))),
        ]).then(arr=>{
            console.log(arr)// 3
        })

3. 전역 적 인 Promise 처리 거부:
node 환경 에서: 정상 적 인 상황 에서 우 리 는 catch 를 사용 하여 이상 을 포착 합 니 다.
Promise.reject("this is wrong").catch(err=>console.log(err))

unhandled Rejection: promise 가 거부 되 었 을 때 이벤트 순환 의 한 라운드 에서 처리 거부 함수 가 호출 되 지 않 으 면 변경 이벤트 가 실 행 됩 니 다.
let rejected = Promise.reject("this is wrong")
process.on("unhandledRejection",function(reason,promise){
console.log(reason.message) //"this is wrong"
console.log(rejected === promise) //true
})

rejection Handled: Promise 가 거부 되 고 이벤트 순환 의 한 라운드 후에 처리 거부 함수 가 호출 되면 이 사건 이 실 행 됩 니 다.
let rejected;
process.on("rejectionHandled",function(promise){
console.log(rejected===promise);
})
rejected = Promise.reject(new Error("this is wrong"));
//          
setTimeout(function(){
     rejected.catch(function(value){
     console.log(value.message)})
},2000)

이 곳 의 rejection Handled 이 벤트 는 처리 함수 가 호출 되 는 것 을 거부 할 때 실 행 됩 니 다.rejected 가 생 성 된 후에 함수 첨부 파일 을 처리 하지 않 으 면 이 사건 은 발생 하지 않 습 니 다.즉시 추 가 된 거부 처리 함 수 는 rejected 가 만 든 이벤트 순환 의 같은 라운드 에서 호출 되 기 때 문 입 니 다.이렇게 하면 rejection Handled 는 소 용이 없다.
4. Promise 와 비동기 적 인 관계:
Promise 자 체 는 비동기 가 아 닙 니 다. 그의 then () 이나 catch () 방법 만 이 비동기 입 니 다. Promise 의 반환 값 은 비동기 라 고 할 수 있 습 니 다.

좋은 웹페이지 즐겨찾기