GithubHelp home page GithubHelp logo

blog's People

Contributors

xingdongyu123 avatar xingdongyu1994 avatar

Stargazers

 avatar

Watchers

 avatar  avatar

blog's Issues

promise的链式调用和中止

promise链式调用

function start () {
return new Promise(function(resolve, reject){
resolve('start')
})
}
start()
.then(function(data){
console.log("第一个",data)
return Promise.resolve("p1")
})
.then(function(data){
console.log("第二个",data)
return Promise.reject("p2")
})
.then(function(data){
console.log("第三个",data)
return Promise.resolve("p3")
})
.catch(function(err){
console.log("第四个", err)
return Promise.resolve("p4")
})
.then(function(data){
console.log("第五个",data)
return Promise.resolve("p5")
})

可以看到catch是捕获到之前promise reject的参数
一旦promise改变了状态变成rejected 就跳过了后面的promise
catch 也可以返回一个新的promise

promise链式中断

可以看到只要前面有promise的reject 改变了promise的状态 就会跳过后面的then方法直接到catch里面
所以在promise链式调用时候 要有不想在某个then以后不再调用了其他的 就可以当做一个异常来处理
返回一个异常信息给 catch 通过返回来判断是程序出现异常还是中止导致

导致问题

如果在promise then 的链路中也对错误进行了捕获就是不一样的效果了
Promise.resolve()
.then(function(){
console.log('第一个')
throw 'throw 1' // 抛出一个错误
})
.then(function(){
console.log('第二个')
}, function(err){
console.log('捕获第一个错误')
})
.then(function(){
console.log('第三个')
})
.catch(err => {
console.log("catch", 错误)
})

以上结果
第一个
捕获第一个错误
第三个
这样就不能中止后面的then了

最好的解决方法

利用then第二个参数 来改变promise 的状态
Promise.resolve()
.then(function(){
console.log('第一个')
return new Promise(function(resolve, reject){}) // 这里返回个是pending状态的promise
})
.then(function(){
console.log('第二个')
}, function(err){
console.log('捕获第一个错误')
})
.then(function(){
console.log('第三个')
})
.catch(err => {
console.log("catch", 错误)
})

结果
第一个

返回一个新的pending状态的promise 原来的promise对象跟现在的返回的promise对象状态一样 就中止了 之前promise链

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.