在前端开发中尤其是在nodejs开发中经常会遇到这样的场景(以ajax为例):有3个(或者更多个)Ajax请求,并且第2个请求依赖于第1个,第3个请求依赖于第2个,那我们可能就会在发第一个Ajax后回调再执行第二个Ajax,第二个执行后再在回调里面执行第三个,如此就形成了回调金字塔了,也显得复杂,当然这种问题也有许多插件,如:Promise、async等。 自己写了一个简单的实现方法:

/**
* 控制流/同步
* @param {Array} arr
* @param {Function} callback1 传递两个参数 (item,next),执行完一项则需执行next()才能执行下一项
* @param {Function} callback2 出错或执行完时回调
* @returns {*}
*/
function async (arr, callback1, callback2) {
if (Object.prototype.toString.call(arr) !== '[object Array]') {
return callback2(new Error('第一个参数必须为数组'));
}
if (arr.length === 0)
return callback2(null);
(function walk(i) {
if (i >= arr.length) {
return callback2(null);
}
callback1(arr[i], function () {
walk(++i);
});
})(0);
}

使用示例:

var arr = ['/a', '/b', '/c', '/d'];
async(arr, function(item, next){
$.ajax({
url:item,
complete:function(){
next();
}
});
},function(err){
console.log(err);
});

JavaScript异步仿同步(控制流)的实现的更多相关文章

  1. 漫话JavaScript与异步·第三话——Generator:化异步为同步

    一.Promise并非完美 我在上一话中介绍了Promise,这种模式增强了事件订阅机制,很好地解决了控制反转带来的信任问题.硬编码回调执行顺序造成的"回调金字塔"问题,无疑大大提 ...

  2. JavaScript异步编程的主要解决方案—对不起,我和你不在同一个频率上

    众所周知(这也忒夸张了吧?),Javascript通过事件驱动机制,在单线程模型下,以异步的形式来实现非阻塞的IO操作.这种模式使得JavaScript在处理事务时非常高效,但这带来了很多问题,比如异 ...

  3. JavaScript异步编程原理

    众所周知,JavaScript 的执行环境是单线程的,所谓的单线程就是一次只能完成一个任务,其任务的调度方式就是排队,这就和火车站洗手间门口的等待一样,前面的那个人没有搞定,你就只能站在后面排队等着. ...

  4. javascript异步编程的前世今生,从onclick到await/async

    javascript与异步编程 为了避免资源管理等复杂性的问题, javascript被设计为单线程的语言,即使有了html5 worker,也不能直接访问dom. javascript 设计之初是为 ...

  5. 【转】JavaScript 异步进化史

    前言 JS 中最基础的异步调用方式是 callback,它将回调函数 callback 传给异步 API,由浏览器或 Node 在异步完成后,通知 JS 引擎调用 callback.对于简单的异步操作 ...

  6. C#中的异步和同步

    同步 同步(英语:Synchronization [ˌsɪŋkrənaɪ'zeɪʃn]),指对在一个系统中所发生的事件(event)之间进行协调,在时间上出现一致性与统一化的现象.说白了就是多个任务一 ...

  7. Promises与Javascript异步编程

    Promises与Javascript异步编程 转载:http://www.zawaliang.com/2013/08/399.html 在如今都追求用户体验的时代,Ajax应用真的是无所不在.加上这 ...

  8. Javascript 异步加载详解

    Javascript 异步加载详解 本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy ...

  9. 5分种让你了解javascript异步编程的前世今生,从onclick到await/async

      javascript与异步编程 为了避免资源管理等复杂性的问题,javascript被设计为单线程的语言,即使有了html5 worker,也不能直接访问dom. javascript 设计之初是 ...

随机推荐

  1. fetch + async await 使用原生JS发送网络请求

    由于现在主流浏览器支持Fetch API,无需引用其他库就能实现AJAX,一行代码就搞定,可以说是非常方便了. export default { name: 'HelloWorld', data() ...

  2. E20181001-ts

    decorate vt. 装饰; 点缀; 粉刷; 授予(某人)勋章  vi. 装饰; 布置;

  3. cogs 1176. [郑州101中学] 月考

    1176. [郑州101中学] 月考 ★   输入文件:mtest.in   输出文件:mtest.out   简单对比时间限制:1 s   内存限制:128 MB [题目描述] 在上次的月考中Bug ...

  4. python 的sorted函数

    sorted函数:sorted(iterable,key,reverse) 其中iterable表示可以迭代的对象,  key是一个函数,用来选取参与比较的元素,reverse则是用来指定排序是倒序还 ...

  5. Mysql | 总结 | 常用的查询语句(单表查询)

    1. 查询单表全部 select* from 数据表名; 2. 查询单表中一个或者多个字段 select 字段1,字段2 from 数据表名; 3. 查询单表中的指定信息 select* from 数 ...

  6. python快排

    代码: def partition(data,left,right): tmp = data[left] while left<right: while left < right and ...

  7. __getitem__,__setitem__,__delitem__

    __getitem__.__setitem__.__delitem__ 总结: __getitem__,__setitem_,__delitem__ : obj[‘属性’]的方式去操作属性时触发的方法 ...

  8. Codeforces Round #532(Div. 2) A.Roman and Browser

    链接:https://codeforces.com/contest/1100/problem/A 题意: 给定n,k. 给定一串由正负1组成的数. 任选b,c = b + i*k(i为任意整数).将c ...

  9. Solr查询中涉及到的Cache使用及相关的实现【转】

    转自:http://www.cnblogs.com/phinecos/archive/2012/05/24/2517018.html 本文将介绍Solr查询中涉及到的Cache使用及相关的实现.Sol ...

  10. centos7安装mysql5.7 使用yum

    https://blog.csdn.net/z13615480737/article/details/78906598 使用yum,比较简单,不用考虑版本依赖问题