最近抽空复习了一下之前读过的JS书，看了一下关于回调函数和promise相关部分。
回调函数
提到异步编程，尽管发展到如今，js中解决异步的方式已经出现了很多种，Promise、async/await... 但不可否认，在这些出现之前，我们采用的最常规的方式就是回调函数，可以说，回调函数是js中最基础的异步模式。但尽管如此，回调还是存在着很多不可忽视的缺点。
- 执行顺序
思考这样一段代码
fs.readFile('file.txt', 'utf-8', functino(data){
console.log('A');
setTimeout(function () {
console.log('B')
}, 0)
console.log('C')
})
console.log('D');
有经验的同学可能稍加推敲就能得出正确结论，
D A C B
但不可置否，这样一段代码的执行顺序是违背我们大脑的正常思维顺序的，我们在大脑中是不断上下跳跃着的。再有，如果把上面的setTimeout换成一个同步函数呢？那么结果就是D A B C。再如果它只是会视情况而定同步或者异步，也就是我们并不确定它是同步还是异步，这样的情况下，我们如何解决呢？
解决方法或许只能将每个步骤硬编码到前一个步骤中了。
但是上述只是个简单例子，现实中的项目远比这个复杂，嵌套的更深，状态更多，
这种方式使得代码可复用性变差，维护成本变高，与我们现在提倡的低耦合相驳。
- 控制反转
// 假如doSomeThing()是一个第三方api，负责做某些事情
// 通过传一个callback来执行接下来的步骤
doSomeThing('...', function () {
// ...
})
上述例子中， callback的执行取决于doSomeThing()，这种现象叫做"控制反转"，如果doSomeThing中发生异常，或者说doSomeThing是一个你根本不了解的第三方api，那么你所传的callback可能出现任何你想不到的情况，因为此时callback的控制权并不在你手中， 你不能决定它何时调用，调用次数，是否传参等等等等....
引用《你不知道的JavaScript中卷》
回调最大的问题是控制反转，它会导致信任链的完全断裂。
总而言之，我们需要一种比回调更好的机制，来解决执行顺序、信任的问题。值得欣喜的是，JS目前已经提供了很多更加强大的异步模式，Promise就是其中之一。
Promise
所谓 Promise，就是一个对象，用来传递异步操作的消息。它代表了某个未来才会知道结果的事件（通常是一个异步操作），并且这个事件提供统一的 API，可供进一步处理。
Promise 对象有以下两个特点。
-
对象的状态不受外界影响。Promise 对象代表一个异步操作，有三种状态：Pending（进行中）、Resolved（已完成，又称 Fulfilled）和 Rejected（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是 Promise 这个名字的由来，它的英语意思就是「承诺」，表示其他手段无法改变。
-
一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise 对象的状态改变，只有两种可能：从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果。就算改变已经发生了，你再对 Promise 对象添加回调函数，也会立即得到这个结果。这与事件（Event）完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。
基本用法
// 我们定义三个异步行为A、B、C
function A (cb) {
setTimeout(function () {
console.log('执行A')
cb && cb()
})
}
function B (cb) {
setTimeout(function () {
console.log('执行B')
cb && cb()
})
}
function C (cb) {
setTimeout(function () {
console.log('执行C')
cb && cb()
})
}
假设这三个行为是相互依赖关系执行，也就是A执行完再执行B，B执行完再执行C
首先看es5的实现方式
A(B(C))
在看Promise版本
function A () {
return new Promise((resolve, reject) => {
setTimeout(function () {
console.log('执行A')
resolve()
})
})
}
function B () {
return new Promise((resolve, reject) => {
setTimeout(function () {
console.log('执行B')
resolve()
})
})
}
function C () {
return new Promise((resolve, reject) => {
setTimeout(function () {
console.log('执行C')
resolve()
})
})
}
A().then(B).then(C);
怎么样，是不是觉得清晰了很多？
回想一下我们在上面回调函数中遇到的两个问题 执行顺序 和 控制反转
- 执行顺序
我们可以看到 在promise中我们可以很清晰的看出来，先执行A接下来是B然后是C,并且我们也不需要关心A或者B中是同步还是异步操作，无论同步异步都不会影响到执行顺序。
这种方式使得我们的代码一眼就可以看清楚他的执行流程，无论维护成本还是清晰程度都比回调函数要好的多，避免了“Callback Hell(回调地狱)”
- 控制反转
Promise拥有个then方法，then方法的第一个参数是resolved状态的回调函数，第二个参数（可选）是rejected状态的回调函数。我们可以根据promise的状态，如果为resolved，就调用第一个回调函数，如果状态变为rejected，就调用第二个回调函数。这样我们相当于把控制权重新拿回到我们自己手中。
举个例子
function A () {
return new Promise((resolve, reject) => {
setTimeout(function () {
console.log('执行A')
resolve('a')
})
})
}
A().then(function(data){
// data就是A返回的proise状态成功后所返回的值
console.log(data); // 'a'
}, function(err) {
// 如果A的状态变为reject,将会处罚这个回调函数
})
除了then之外，promise还有几个方法。
Promise.prototype.catch()；
Promise.prototype.catch()方法是.then(null, rejection)或.then(undefined, rejection)的别名，用于指定发生错误时的回调函数
promiseFn.then(function(posts) {
// ...
}).catch(function(error) {
// 处理 promiseFn 和 前一个回调函数运行时发生的错误
console.log('发生错误！', error);
});
Promise.all()
Promise.all()用于将多个 Promise 实例，包装成一个新的 Promise 实例。
const p = Promise.all([p1, p2, p3]);
返回的结果是一个数组，里面对应参数中的几个promise实例的返回值。
只有当这几个实例的状态都变成成功，或者其中有一个变为失败，才会调用Promise.all方法后面的回调函数。
Promise.race()
Promise.race()方法同样是将多个 Promise 实例，包装成一个新的 Promise 实例。
const p = Promise.race([p1, p2, p3]);
但是不同于Promise.all的是，只要p1、p2、p3之中有一个实例率先改变状态，p的状态就跟着改变。那个率先改变的 Promise 实例的返回值，就传递给p的回调函数。
网友评论