ES6 中的promise

对于promise大家一定都很熟悉,不管是在面试中还是在工作中,正好今天看了一本和promise相关的书难得有时间那就来谈谈读后感吧。

首先promise是什么?promise是一个异步处理的对象已经对其进行各种处理的组件。

在之前的时候异步处理我们都是使用回调函数的概念,node里面就是大量的回调函数,例如文件的读写

fs.readFile('file1.txt', 'utf8', function (err, data) { if (err) throw err; console.log('文件 被读取' + data); });

因为在操作中我们并不确定文件哪一个被先读取取决于文件的大小,而这里体现了异步操作,当我们的文件被读取回调函数就会被执行,所谓的回调就是函数被当作参数传递进来,这是javascript独有的,算是一个先进性吧,所以在我们原来的异步函数中都是依靠大量的回调函数来进行处理的。

其实promise就是把基于异步处理的回调函数的处理进行了规则化,因为上文中如果读取的文件并不会按照代码顺序执行但是当我们执行的时候还需要进行下一步的操作就是回调函数来处理,所以promise就是基于异步处理的回调函数规则化,让我们来更加规范化更加明了。

利用promise读取文件的编程。

var promise = getAsyncPromise("fileA.txt");

promise.then(function(result){

// 获取文件内容成功时的处理

}).catch(function(error){
// 获取文件内容失败时的处理});

这是一段我的测试代码来自于书上可以看见这个new Promise(function(resolve){   resolve(42);})传入了一个回调函数然后返回的是一个Promise对象,当成功的时候就会执行回调函数中的值因为回调函数里的resolve里的参数是42

var promise = new Promise(function(resolve){
   resolve(42);
    console.log(resolve);
   
});
promise.then(function(value){
  console.log(value);
}).catch(function(error){
    console.error(error);

});

输出结果是:

function (value) { resolver.resolve(value); }
42

可以看出来回调函数会在之后执行,resolve就是一个函数function (value) { resolver.resolve(value); },而且这个函数并没有像我们以为的先是输出42因为先调用了  resolve(42);为啥没执行,因为 resolve(42);就是一个回调函数啊,这个就是我们的我们基于回调函数的处理啊。只有先执行自己的内容之后才调用回调函数.

首先来理解一下Promise的 API这里是有

Constructor构造函数我们可以利用构造函数来创建一个promise对象

var promise = new Promise(function(resolve, reject) {  

// 异步处理  

// 处理结束后、调用resolve 或 reject函数

});

实例方法

对通过new生成的promise对象为了设置其值在 resolve(成功) / reject(失败)时调用的回调函数 可以使用promise.then() 实例方法。

promise.then(onFulfilled, onRejected)
resolve(成功)时

onFulfilled 会被调用

reject(失败)时

onRejected 会被调用

onFulfilledonRejected 两个都为可选参数。

promise.then 成功和失败时都可以使用。

 另外在只想对异常进行处理时可以采用 promise.then(undefined, onRejected) 这种方式,只指定reject时的回调函数即可。 不过这种情况下 promise.catch(onRejected) 应该是个更好的选择。

promise.catch(onRejected)所以一般都是promise.then(onFulfilled);promise.catch(onRejected)

Promise静态方法

像 Promise 这样的全局对象还拥有一些静态方法。

包括 Promise.all() 还有 Promise.resolve() 等在内,主要都是一些对Promise进行操作的辅助方法。

function asyncFunction() {
    (1)
    return new Promise(function (resolve, reject) {
        setTimeout(function () {
            resolve('Async Hello world');
        }, 16);
    });
}
(2)
asyncFunction().then(function (value) {
    console.log(value);    // => 'Async Hello world'
}).catch(function (error) {
    console.log(error);
});
1 里面创造了一个promise实例2里面因为成功的时候会调用then里面的函数   resolve('Async Hello world');在then里resolve的value是在创建promise对象里给传递的,所以就可以知道value 值打印一下resolve是这样的
function (value) { resolver.resolve(value); }是一个函数

2promise对象用设置 .then 调用返回值时的回调函数。

asyncFunction 这个函数会返回promise对象, 对于这个promise对象,我们调用它的 then 方法来设置resolve后的回调函数, catch 方法来设置发生错误时的回调函数。then里面函数 value对应resolve里面的参数。

该promise对象会在setTimeout之后的16ms时被resolve, 这时 then 的回调函数会被调用,并输出 'Async Hello world' 。

function asyncFunction() {
    (1)
    return new Promise(function (resolve, reject) {
      
            resolve('Async Hello world');
           });
}
(2)
asyncFunction().then(function (v) {
    console.log(value);    // => 'Async Hello world'
}).catch(function (error) {
    console.log(error);

});

输出结果是:ReferenceError: value is not defined执行了错误语句找不到value

promise.then(fulfilled,  reject) 当没有得到想要的值就会执行后面的reject函数,但是这样的缺点是在promise里面是 throw一个error就会被resolve接受到但是其实这是一个异常resolve无法处理就会报错,但是reject处理异常还是接受不到,所以就会造成问题,所以我们比较希望使用.catch()里面放函数来进行处理,就是说在resolve函数被执行的时候,就会把这个异常向下抛出因为.then方法也会返回一个promise对象,然后就会调用后面的 .catch() 方法来处理 .then 里面的异常。

静态方法promise.all这个函数里面是参数是一个数组里面都是promise对象,而这些对象都是同一时间进行的,并不是按照数组的中的顺序,当所有的都返回fulfilled就是代表结束。

静态方法promise.race()就是只要有一个promise对象成功fulfilled就会结束函数。promise.race()和promise.all()里面都是promise对象的数组,都会返回promise对象就是之后可以调用.then  方法.catch方法。这些就是我对promise的理解其他的一下库像blue bird 都是基于promise来封装的这个还没有看过。不过一步的处理对于我们是十分必要的。

推荐写法:promise.then().catch() 来处理异常或者正常每一次都会返回一个promise对象,所以这也是链式调用的原因不过每一次返回的都是一个新的promise对象。

猜你喜欢

转载自blog.csdn.net/qq_32798243/article/details/79827377