这是我的第一篇学习笔记，写的不好，请大家多多包涵。
在我工作写代码的过程中，经常会用到异步操作，那时的我，只用到过ajax的异步，年轻的我也没怎么深究。就这样傻傻地用了好几个月。
某天突然出现一个契机，遇到一个不是AJAX请求，但是要做异步处理的情况。这时，作为一个正常人，度娘已经打开了。promise，async await几乎成了所有文章的关键字，我就好好了解了一下。
1. Promise
Promise是一种异步解决方案，有三种状态分别为pending-进行中、resolved-已完成、rejected-已失败
现在先来说说它的基本用法：
// 方法1
let promise = new Promise ( (resolve, reject) => {
if ( success ) {
resolve(a) // pending ——> resolved 参数将传递给对应的回调方法
} else {
reject(err) // pending ——> rejectd
}
} )
// 方法2
function promise () {
return new Promise ( function (resolve, reject) {
if ( success ) {
resolve(a)
} else {
reject(err)
}
} )
}
PS：参数中的方法会在声明此对象的时候立即执行
then() VS catch()
promise.then(
() => { console.log('this is success callback') }, // resolve的回调
() => { console.log('this is fail callback') } // rejected的回调
)
promise.then(
() => { console.log('this is success callback') }
).catch(
(err) => { console.log(err) }
)
对于then(),catch()都会返回一个新的Promise对象，之前我一直有个疑问，如果有多个相同状态的回调，是连续触发呢，还是只触发一个。实验证明，确实只能触发一个回调。
Promise其他API
resolve() reject()
参数是Promise：原样返回
参数带有then方法：转换为Promise后立即执行then方法
参数不带then方法、不是对象或没有参数：返回resolved状态的Promise
all
var promise = Promise.all( [p1, p2, p3] )
promise.then(
...
).catch(
...
)
只有当状态一起变为resolved，状态才会变成resolved，只要有一个变成rejected，则状态立刻变为rejected
race
var promise = Promise.race( [p1, p2, p3] )
promise.then(
...
).catch(
...
)
与all有一点不用，只要有一个状态改变，整体状态就执行相应的回调函数
finally
不管最终状态是什么，一定被执行（状态改变时执行）
2. async await
说到async await，我之前是很少接触的。可以说是完全不用，因为我都用Promise来代替所有的异步操作，我相信大多数人和我一样。
Promise是回调函数的升级，因为他通过.then链路,避免了回调地狱。
而async await 可以Promise的升级，就让我们来好好了解下吧。
async await用来来干什么
既然说是Promise的升级，那么它肯定也是异步编程的解决方案
async是用来声明一个function是异步的，await则是等待这个异步function完成的
async function testAsync() {
return "hello async";
}
const result = testAsync();
console.log(result);
这里打印出来的result竟然是一个Promise对象，所以说它是Promise升级，它的本质其实还是Promise
要说一句，await必须在async声明的异步函数里才能使用
await等的是什么
这样看来await等的是一个Promise对象，其实不然，await等的其实就是任意表达式的结果，其实等Promise也是在等他返回的值。
async await 有什么好处
Promise当执行链路多而复杂时，函数的各种参数可以让你欲仙欲死，然而async await代码清晰，逻辑简单，看上去像是同步方法一样。
3. AJAX
当然在了解这些新特性的同时，我也不会喜新厌旧，ajax的原理也是需要了解一下的。
AJAX的原理创建异步对象XMLHttpRequest，创建方法：new XMLHttpRequest()，当然也有特例，IE6以上的IE创建方法则是new ActiveObject("Msxml2.XMLHTTP")。而异步的原理就是设置回调函数onreadystatechange，每当异步对象readyState状态改变则会进入此回调函数。异步操作就此完成。
网友评论