摘要：按照要求实现函数，把传进去的函数数组按顺序先后执行，并且把返回的数据先后放到数组中。例子中我们是按顺序执行的，但是输出的结果却是，对于这些异步函数来说，并不会按顺序执行完一个，再执行后一个。
按照要求：
实现 mergePromise 函数，把传进去的函数数组按顺序先后执行，并且把返回的数据先后放到数组 data 中。
代码如下：
const timeout = ms => new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
}, ms);
});
const ajax1 = () => timeout(2000).then(() => {
console.log("1");
return 1;
});
const ajax2 = () => timeout(1000).then(() => {
console.log("2");
return 2;
});
const ajax3 = () => timeout(2000).then(() => {
console.log("3");
return 3;
});
const mergePromise = ajaxArray => {
// 在这里实现你的代码
};
mergePromise([ajax1, ajax2, ajax3]).then(data => {
console.log("done");
console.log(data); // data 为 [1, 2, 3]
});
// 要求分别输出
// 1
// 2
// 3
// done
// [1, 2, 3]
分析：
timeout是一个函数，这个函数执行后返回一个promise实例。
ajax1 、ajax2、ajax3 都是函数，不过这些函数有一些特点，执行后都会会返回一个 新的promise实例。
按题目的要求我们只要顺序执行这三个函数就好了，然后把结果放到 data 中，但是这些函数里都是异步操作，想要按顺序执行，然后输出 1，2，3并没有那么简单，看个例子。
function A() {
setTimeout(function () {
console.log("a");
}, 3000);
}
function B() {
setTimeout(function () {
console.log("b");
}, 1000);
}
A();
B();
// b
// a
例子中我们是按顺序执行的 A，B 但是输出的结果却是 b，a 对于这些异步函数来说，并不会按顺序执行完一个，再执行后一个。
这道题主要考察的是Promise 控制异步流程，我们要想办法，让这些函数，一个执行完之后，再执行下一个，代码如何实现呢？
// 保存数组中的函数执行后的结果
var data = [];
// Promise.resolve方法调用时不带参数，直接返回一个resolved状态的 Promise 对象。
var sequence = Promise.resolve();
ajaxArray.forEach(function (item) {
// 第一次的 then 方法用来执行数组中的每个函数，
// 第二次的 then 方法接受数组中的函数执行后返回的结果，
// 并把结果添加到 data 中，然后把 data 返回。
sequence = sequence.then(item).then(function (res) {
data.push(res);
return data;
});
})
// 遍历结束后，返回一个 Promise，也就是 sequence， 他的 [[PromiseValue]] 值就是 data，
// 而 data（保存数组中的函数执行后的结果） 也会作为参数，传入下次调用的 then 方法中。
return sequence;
大概思路如下：全局定义一个promise实例sequence，循环遍历函数数组，每次循环更新sequence，将要执行的函数item通过sequence的then方法进行串联，并且将执行结果推入data数组，最后将更新的data返回，这样保证后面sequence调用then方法，如何后面的函数需要使用data只需要将函数改为带参数的函数。
欢迎转发、关注、点击好看。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/102171.html
摘要：前文该系列下的前几篇文章分别对不同的几种异步方案原理进行解析，本文将介绍一些实际场景和一些常见的面试题。流程调度里比较常见的一种错误是看似串行的写法，可以感受一下这个例子判断以下几种写法的输出结果辨别输出顺序这类题目一般出现在面试题里。 前文 该系列下的前几篇文章分别对不同的几种异步方案原理进行解析，本文将介绍一些实际场景和一些常见的面试题。(积累不太够，后面想到再补) 正文 流程调度...
摘要：应用把一个异步操作和定时器放在一起。如果定时器先触发就提示用户超时用户超时什么是值穿透或者期望传入一个函数如果不是函数会发生值穿透和的第二个参数的区别比较类似是一个语法糖相当于还有一点区别就是如果第一个报错第二个无法捕获。 Promise使用细节 使用promise需要注意的几点: 1.如何用promise实现并行的异步 (Promise.all配合.map) Promise.all...
摘要：不过幸运的是所有面试的公司都给了，在这里总结下经验吧。这里推荐下我当时看的一篇的面经，木易杨老师写的大厂高级前端面试题汇总。 前言 本人毕业一年，最近陆续面试了头条、瓜子、360、猿辅导、中信银行、老虎等公司，由于最近比较寒冬而且招1-3年的并不多，再加上自己对公司规模和位置有一定要求，所以最后合适的也就这几家了。不过幸运的是所有面试的公司都给了offer，在这里总结下经验吧。掘金：h...
摘要：在中，又由于单线程的原因，异步编程又是非常重要的。方法有很多，，，观察者，，，这些中处理异步编程的，都可以做到这种串行的需求。 引入 队列对于任何语言来说都是重要的，io 的串行，请求的并行等等。在 JavaScript 中，又由于单线程的原因，异步编程又是非常重要的。昨天由一道面试题的启发，我去实现 JS 中的异步队列的时候，借鉴了 express 中间件思想，并发散到 co 实现 ...
本文涵盖 面试题的引入 对事件循环面试题执行顺序的一些疑问 通过面试题对微任务、事件循环、定时器等对深入理解 结论总结 面试题 面试题如下，大家可以先试着写一下输出结果，然后再看我下面的详细讲解，看看会不会有什么出入，如果把整个顺序弄清楚 Node.js 的执行顺序应该就没问题了。 async function async1(){ console.log(async1 start) ...
阅读 2440·2021-11-19 09:40
阅读 3562·2021-11-17 17:08
阅读 3750·2021-09-10 10:50
阅读 2181·2019-08-27 10:56
阅读 1888·2019-08-27 10:55
阅读 2622·2019-08-26 12:14
阅读 973·2019-08-26 11:58
阅读 1478·2019-08-26 10:43
