[转载](基础)Promise中then()方法使用,多次调用、链式调用

多次调用then,每次res值都是new Promise的值

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const promise = new Promise((resolve, reject) => {
  resolve("hahaha")
})
// 1.同一个Promise可以被多次调用then方法
// 当我们的resolve方法被回调时, 所有的then方法传入的回调函数都会被调用
promise.then(res => {
  console.log("res1:", res)    //hahaha
})
promise.then(res => {
  console.log("res2:", res)    //hahaha
})
promise.then(res => {
  console.log("res3:", res)    //hahaha
})

链式调用then

then方法传入的 "回调函数: 可以有返回值

then方法本身也是有返回值的, 它的返回值是Promise

如果返回的是一个普通值(数值/字符串/普通对象/undefined), 那么这个普通的值被作为一个新的Promise的resolve值

then的链式调用接受之前tnen返回的新Promise

复制代码
const promise = new Promise((resolve, reject) => {
  resolve("hahaha")
})
promise.then(res => {
  return "aaaaaa"    
  //或包装Promise的resolve值返回
  // new Promise((resolve, reject) => {
  //   resolve("aaaaaa")
  // })
}).then(res => {               //这里.then的res是前一个then的返回值 resolve("aaaaaa")
  console.log("res:", res)     //aaaaaa
})
 
promise.then(res => {
  // 如果没有返回值如下
  //或包装Promise的resolve值返回
  // new Promise((resolve, reject) => {
  //   resolve("undefined")
  // })
}).then(res => {                   //这里.then的res是前一个then的返回值 resolve("undefined")
  console.log("res:", res)         //undefined
})
复制代码

如果返回的是一个Promise

复制代码
const promise = new Promise((resolve, reject) => {
  resolve("hahaha")
})
promise.then(res => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(111111)
    }, 3000)
  })
}).then(res => {
  console.log("res:", res)   //111111  3秒后打印 由返回的Promise状态决定
})
复制代码

如果返回的是一个对象, 并且该对象实现了thenable

1
2
3
4
5
6
7
8
9
10
11
12
const promise = new Promise((resolve, reject) => {
  resolve("hahaha")
})
promise.then(res => {
  return {
    then: function(resolve, reject) {
      resolve(222222)
    }
  }
}).then(res => {
  console.log("res:", res)    //222222
})

  

  

posted @   方头小小狮  阅读(400)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
点击右上角即可分享
微信分享提示