构造承诺链答案

【问题标题】：Structure promise chain构造承诺链
【发布时间】：2022-01-24 20:41:13
【问题描述】：

有什么方法可以更好地构建代码吗？特别是如何在“承诺链”中处理异常？

$("#save").click(function(e) {
    e.preventDefault();

    let $self = $(this);
    let profile = {}

    $self.prop("disabled", true)

    profile['oldPassword'] = $('#oldPassword').val();
    profile['newPassword'] = $('#newPassword').val();

    Profile.validateForm(profile).then(() => {
        Profile.sendAjax(profile).then(() => {
            $('#oldPassword').val('');
            $('#newPassword').val('');
            $("#profileAlert").text('Password changed successully').removeClass('alert-danger').addClass('alert-success').show().delay(5000).fadeOut()
        }).catch(e => {
            $("#profileAlert").text(e).removeClass('alert-success').addClass('alert-danger').show()
        }).finally(() => {
            $self.prop("disabled", false)
        })
    }).catch(e => {
        $("#profileAlert").text(e).removeClass('alert-success').addClass('alert-danger').show()
    }).finally(() => {
        $self.prop("disabled", false)
    })
});

【问题讨论】：

你的代码没有对sendAjax.then().catch().finally()返回的承诺做任何事情。

标签： javascript jquery ajax promise

【解决方案1】：

鉴于您的 catch 和 finally 回调行为相同，您可以安全地链接承诺：

Profile.validateForm(profile).then(() => {
  return Profile.sendAjax(profile);
}).then(() => {
  $('#oldPassword').val('');
  $('#newPassword').val('');
  $("#profileAlert").text('Password changed successully').removeClass('alert-danger').addClass('alert-success').show().delay(5000).fadeOut()
}).catch(e => {
  $("#profileAlert").text(e).removeClass('alert-success').addClass('alert-danger').show()
}).finally(() => {
  $self.prop("disabled", false)
})

【讨论】：