JS-promise 相关
promise 的流程
基本的构造是这样: new Promise().then().catch()
new Promise( function(resolve, reject) {
// 执行异步操作
// 对异步进行判断,如果是成功则执行 resolve( resolveData )
// 如果失败,则执行 reject( rejectData )
// 其中 resolve 和 reject 是关键词,或者说大家已经达成共识的保留词
} )
如果执行了 resolve 函数,则 then 会执行,
then(function(data) {
// 处理 data,这个 data 就是上面的 resolveData
})
如果执行 reject 函数,则 catch 会执行,
catch(function(e) {
// 处理 e,而 e 则是上面的 rejectData
})
和普通回调函数相比, promise 只是将逻辑从回调转成了外部调用,使代码逻辑更加简洁了吗?这个我不太清粗。但是要注意的是,和普通回调相比,我们需要改造的就是回调部分,或者说异步执行的部分,这部分函数内部一定会执行 resolve() 或者 reject(),只是将回调函数放到了 then() 里而已了。
举例俩说,正常的 ajax 核心代码是这样的:
request.onreadystatechange = function () {
if (request.readyState === 4) {
if (request.status === 200) {
return success(request.responseText);
} else {
return fail(request.status);
}
}
}
那么这个 onreadystatechange 就是回调函数,那在 promise 里改造的话就是改造这个。将 success() 这个回调部分直接改为 resolve(),而将 fail() 部分直接改为 reject(),然后再 promise 后再写 then() 替代 success 的功能,而 catch() 来替代 fail 的功能。
同理,如果是 setTimeout 在 promise 里的话,应该就是对 setTimeout 里面的内容进行判断,成功的话就执行 resolve(),然后把 resolve 要处理的内容放在 then() 中处理,而失败的话则执行 reject(),然后在 catch() 里执行要处理的问题。
promise
最近在看 promise 相关的内容,找到一些不错的资源先罗列下来。
JavaScript Promise API,这里面有一个原生 js 实现 ajax 的代码,非常值得一读,里面就是关于 promise 在实际中使用的非常好的例子,可以让你能更明白实际中使用 promise 的效果。
JavaScript Promises: an Introduction,这是一篇 google 开发者网页上的 promise 简介,目前还没有仔细阅读。
2017.3.27 first published