Javascript----Promise初步探究

最新推荐文章于 2025-08-14 17:31:00 发布

原创最新推荐文章于 2025-08-14 17:31:00 发布 · 235 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #es6

学习笔记专栏收录该内容

3 篇文章

订阅专栏

本文深入讲解JavaScript中Promise的构造器及then和catch方法的使用，包括函数A的定义、resolve和reject的作用，以及如何通过方法链实现异步操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近大概研究了javascript的Promise的用法之后，参照mdn，做出一些很浅显的总结

构造器
new Promise(function(resolve, reject) {});
- Promise的构造器有一个参数，这个参数是一个函数，暂且叫他做函数A。
- 函数A有两个参数，分别是resolve，和rejected，而这两个参数也都是函数，而javascript对于函数参数并没有像c++一样严格的要求，所以尽管形参有两个，但实参可以有一个或两个甚至0个。
- resolve和rejected都是只有一个参数的函数，分别对应Promise的成功消息的失败消息
  下面给出一段示例

var p = new Promise(function(resolve/*,rejected//可以根据需要选择*/){
    if(doSomethingAsync())
        resolve('成功的消息');
    /*else rejected('失败的消息');*/
})

then方法
定义了Promise对象之后，就可以使用Promise的then方法。
then方法原型
Promise.then(onFulfilled,onRejected)
- then方法有两个参数，并且都是函数，两个函数都是以on开头，是不是类似于onClick之类的属性？对的，这也是一个类似于处理事件的函数，处理的是成功和失败的消息。
- onFulfilled函数在与resolve的参数是相同的，大概可以看作resolve会把参数传送给onFulfilled的参数，所以resolve的实参就是onFulfilled的参数。onRejected与之类似。
  代码示例

var p = new Promise(
    function(resolve,rejected)
    {
        resolve('message');
        console.log('after resolve')
    });
p.then(
    function(v1)
    {
        console.log(v1+' resolving')
    },
    function(v2)
    {
        console.log(v2+' rejected');//onRejected部分，没有被调用
    })
    //结果：
    //after resolve
    //message resolving

与then方法类似的还有catch方法

方法链
Promise的then和catch函数还支持方法链。因为then在一些时候会返回一个Promise对象
- 如果在then的参数的两个函数中没有显式的返回Promise对象，而返回了其他值，这个返回值会被再次传递给下一个then方法，相当于重新调用了一次resolve方法传送参数

var p = new Promise(function(resolve,rejected)
                     {resolve(1)});
p.then(function(val){
    return 3
    })
.then(function(val){
    console.log(val);
})
//结果：
//3

- 如果then的参数的两个函数显式的返回了新的Promise对象，后面的then或catch对象都会是新的Promise对象

var p = new Promise(function(resolve,rejected)
                     {resolve(1)});
p.then(function(val){
    return new Promise(function(resolve){
        resolve(2);
    })
.then(function(val){
    console.log(val);
})
//结果：
//2