>  기사  >  웹 프론트엔드  >  약속 원칙

약속 원칙

藏色散人
藏色散人원래의
2019-07-10 10:27:323740검색

약속 원칙

1. 약속 적용 시나리오

1 콜백 지옥 해결

예를 들어 다음 비동기 작업을 위한 입력 매개변수로 데이터 조각을 비동기적으로 요청해야 하는 경우가 종종 있습니다

getData(function(a){  
    getMoreData(a, function(b){
        getMoreData(b, function(c){ 
            getMoreData(c, function(d){ 
                getMoreData(d, function(e){ 
                    ...
                });
            });
        });
    });
});

찾을 수 있습니다 위의 코드는 중첩된 레이어로 인해 매우 무섭습니다. 복잡한 논리적 판단이 추가되면 코드의 가독성이 매우 떨어집니다.

그러나 promise를 사용하는 경우:

function getData() {
    return new Promise(function (resolve, reject) {
        resolve(1);
    });
}
function getMoreData(arg) {
    return new Promise(function (resolve, reject) {
        resolve(arg + 10);
    });
}
getData().then(function (a) {
    console.log(a); // 1
    return getMoreData(a);
}).then(function (b) {
    console.log(b); // 11
})

위 코드를 더 간결하게 만듭니다.

getData()
.then(a => getMoreData(a))
.then(b => console.log(b));

2 promise는 여러 요청을 보낸 후에 완료될 수 있습니다. 그런 다음 get 또는 특정 결과 처리

// 两个数据都回来之后再进行操作
let fs = require('fs');
fs.readFile('./1.txt', 'utf8', function (err, data) {
    console.log(data);
})
fs.readFile('./2.txt', 'utf8', function (err, data) {
    console.log(data);
})
使用promise的话就可以实现:
let fs = require('fs');
function read(url){
    return new Promise(function(resolve,reject){
        fs.readFile(url,'utf8',function(err,data){
            if(err)reject(err);
            resolve(data);
        })
    })
}
Promise.all([read('1.txt'),read('2.txt')]).then(data=>{
    console.log(data);
},err=>{
    console.log(err);
});

2. 약속 원칙 구현

1 가장 간단한 구현

#🎜 🎜#기반 위의 애플리케이션 시나리오에서 Promise는 pedding, 이행 및 거부라는 세 가지 상태를 가질 수 있음을 알 수 있습니다.

Pending Promise 객체 인스턴스가 생성된 초기 상태

Fulfilled는 성공한 상태로 이해 가능

Rejected는 실패한 것으로 이해 가능 state #🎜🎜 #

Promise 인스턴스를 생성하려면 Promise 생성자에 함수를 전달해야 합니다. 전달된 함수에는 두 개의 형식 매개변수가 있어야 하며, 둘 다 함수 유형 매개변수입니다. 그들은 각각 해결과 거부입니다.

Promise에도 then 메소드가 있습니다. then 메소드는 Promise 객체의 상태가 변경될 때 실행될 작업을 지정하는 데 사용됩니다. (onRejected)

Reject로 상태가 바뀌면 Reject로 바뀔 수 없으며, 그 반대도 마찬가지입니다.

위의 설명을 바탕으로 이러한 약속을 구현할 수 있습니다

function Promise(executor){ //executor执行器
    let self = this;
    self.status = 'pending'; //等待态
    self.value  = undefined; // 表示当前成功的值
    self.reason = undefined; // 表示是失败的值
    function resolve(value){ // 成功的方法
        if(self.status === 'pending'){
            self.status = 'resolved';
            self.value = value;
        }
    }
    function reject(reason){ //失败的方法
        if(self.status === 'pending'){
            self.status = 'rejected';
            self.reason = reason;
        }
    }
    executor(resolve,reject);
}
Promise.prototype.then = function(onFufiled,onRejected){
    let self = this;
    if(self.status === 'resolved'){
        onFufiled(self.value);
    }
    if(self.status === 'rejected'){
        onRejected(self.reason);
    }
}
module.exports = Promise;

위 내용은 약속 원칙의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.