1 通过回调的方式来处理异步返回的结果
function getApi() { //}
setTtimeout(() => {
getApi() // 模拟异步操作
})
这样的问题会是, 我有多个异步操作 我该怎么去处理, 请求成功和失败该怎么返回, 成功和失败的回调分别叫什么名字
ajax = (method, url, options)=>{
const {success, fail} = options // 析构赋值,别再问
const request = new XMLHttpRequest()
request.open(method, url)
request.onreadystatechange = ()=>{
if(request.readyState === 4){
// 成功就调用 success,失败就调用 fail
if(request.status < 400){
success.call(null, request.response)
}else if(request.status >= 400){
fail.call(null, request, request.status)
}
}
}
request.send()
}
假设我们对于异步操作使用上面的代码去处理, 那么 成功和失败暂定为 success 和 fail, 其实这样不是很规范, A 同学 可能是这样, B 同学 有可能定义为 done 和 unsuccess, 这样就不是很一致, 要如何解决一致, 就需要使用 promise
2 使用 propmise 来处理
promise 在大部分人的认知里面是一种前端的技术, 其实严格来说, propmise是一种设计模式, 它是1976 年的诞生一种设计模式, 使用这个设计模式来解决异步问题
ajax = (method, url, options)=>{
return new Promise((resolve, reject)=>{
const {success, fail} = options
const request = new XMLHttpRequest()
request.open(method, url)
request.onreadystatechange = ()=>{
if(request.readyState === 4){
// 成功就调用 resolve,失败就调用 reject
if(request.status < 400){
resolve.call(null, request.response)
}else if(request.status >= 400){
reject.call(null, request)
}
}
}
request.send()
})
}
3 promise 代替 回调来处理异步 有哪些好处或者说是优点呢
1.规范回调的名字或顺序
2.拒绝回调地狱,让代码可读性更强
3.很方便地捕获错误