与承诺中的 .then() 混淆答案

【问题标题】：confused with .then() in promises与承诺中的 .then() 混淆
【发布时间】：2021-01-19 01:05:37
【问题描述】：

我是 js 新手，正在学习 Promise。我想出了这段代码，它将打印每个函数的解析值，并使用.then调用新函数


function login() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {

            resolve({username : 'default'})
        }, 1000)
    })
}

function getVideos() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(['vid1', 'vid2'])
        },1000)
    })
}

function getDesc() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {

            resolve('desc')
        }, 1000)
    })
}


const test = login()
test.then(res => {
    console.log(res)
    getVideos()
})
.then(res => {
    console.log(res)
    getDesc()
})
.then(res => console.log(res))

但是，我没有得到预期的结果，我认为.then() 中的所有语句都需要执行并解决以继续下一个.then() 语句。但显然情况并非如此，因为我得到以下输出 -

{ username: 'default' }
undefined
undefined

但我希望输出与此类似 -

{username : 'default}
['vid1', 'vid2']
desc

请指出我在这里出错的地方。任何帮助表示赞赏，非常感谢

【问题讨论】：

标签： javascript asynchronous promise resolve

【解决方案1】：

当您调用这些函数时，您需要将return 添加到您的链中。例如：

function login() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {

            resolve({username : 'default'})
        }, 1000)
    })
}

function getVideos() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(['vid1', 'vid2'])
        },1000)
    })
}

function getDesc() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {

            resolve('desc')
        }, 1000)
    })
}


const test = login()
test.then(res => {
    console.log(res)
    return getVideos()
})
.then(res => {
    console.log(res)
    return getDesc()
})
.then(res => console.log(res))

这是一个很好的指南：https://javascript.info/promise-chaining

【讨论】：

是的，这就是解决方案。可能有助于提及 OP 看到 undefined因为缺少 return 语句——没有 return 语句的函数将返回 undefined。
developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/….
@dwosk 谢谢，你能不能链接任何关于异步和等待的好指南，mdn 中的那个还不够

【解决方案2】：

进行一些非常小的更改：

const test = login()
test.then(res => {
  console.log(res)
  return getVideos()
})
.then(res => {
  console.log(res)
  return getDesc()
})
.then(res => console.log(res))

要将 Promise 链接在一起，您需要在每一步都返回 Promise。因为它是你隐含地返回 undefined 这不是一个承诺。

【讨论】：

非常感谢，我现在知道了。