ES6 의 Promise 와 비동기 프로 그래 밍 을 깊이 이해 하 다.
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 의 반환 값 은 비동기 라 고 할 수 있 습 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
[2022.04.19] 자바스크립트 this - 생성자 함수와 이벤트리스너에서의 this18일에 this에 대해 공부하면서 적었던 일반적인 함수나 객체에서의 this가 아닌 오늘은 이벤트리스너와 생성자 함수 안에서의 this를 살펴보기로 했다. new 키워드를 붙여 함수를 생성자로 사용할 때 this는...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.