异步回调是js的一大特性,理解好用好这个特性可以写出很高质量的代码。分享一些实际用的一些异步编程技巧。

1.我们有些应用环境是需要等待两个http请求或IO操作返回后进行后续逻辑的处理。而这种情况使用回调嵌套代码会显得很难维护,而且也没有充分使用js的异步优势。

看下实例(为了大家容易理解使用了jq作为示例)

  $.get("获取数据1.html",function(data,status){
$.get("获取数据2.html",function(data1,status1){
//使用 data 和data1逻辑
});
});

这种代码明显需要等待上个ajax请求返回后才会进行第二个请求,效率很低,而且回调嵌很不利于逻辑。我们可以使用计数器的方式,每完成一个请求计数器加1 当计数器等于2时执行回调逻辑

var get_data
var get-data1
function next(){
//使用 data 和data1逻辑
}
$.get("获取数据1.html",function(data,status){
get_data=data
(++over === all) && (next());
});
$.get("获取数据2.html",function(data1,status1){
get_data1=data1
(++over === all) && (next()); });

这种方式两个http并行发送,极大的提高了效率

js异步编程技巧一的更多相关文章

  1. JS魔法堂:深究JS异步编程模型

    前言  上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...

  2. js异步编程

    前言 以一个煮饭的例子开始,例如有三件事,A是买菜.B是买肉.C是洗米,最终的结果是为了煮一餐饭.为了最后一餐饭,可以三件事一起做,也可以轮流做,也可能C需要最后做(等A.B做完),这三件事是相关的, ...

  3. 深究JS异步编程模型

    前言  上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...

  4. node.js异步编程的几种模式

    Node.js异步编程的几种模式 以读取文件为例: 1.callback function const fs = require('fs'); //callback function fs.readF ...

  5. 前端分享----JS异步编程+ES6箭头函数

    前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...

  6. JS异步编程 (2) - Promise、Generator、async/await

    JS异步编程 (2) - Promise.Generator.async/await 上篇文章我们讲了下JS异步编程的相关知识,比如什么是异步,为什么要使用异步编程以及在浏览器中JS如何实现异步的.最 ...

  7. JS异步编程 (1)

    JS异步编程 (1) 1.1 什么叫异步 异步(async)是相对于同步(sync)而言的,很好理解. 同步就是一件事一件事的执行.只有前一个任务执行完毕,才能执行后一个任务.而异步比如: setTi ...

  8. node.js异步编程解决方案之Promise用法

    node.js异步编程解决方案之Promise var dbBase = require('../db/db_base'); var school_info_db = require('../db/s ...

  9. 一个例子读懂 JS 异步编程: Callback / Promise / Generator / Async

    JS异步编程实践理解 回顾JS异步编程方法的发展,主要有以下几种方式: Callback Promise Generator Async 需求 显示购物车商品列表的页面,用户可以勾选想要删除商品(单选 ...

随机推荐

  1. Java–cvc-complex-type.4:Attribut ‘version’ must appear on element ‘web-app’

    问题解析: 在web.xml中的以下代码中 <web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi=" ...

  2. LINQ系列目录

    1. LINQ准备 1.1 C#中与LINQ相关特性 2. LINQ to Object 2.1 LINQ to Object投影操作符(Select/SelectMany/Let) 2.2 LINQ ...

  3. 《JavaScript高级程序设计》读书笔记 2

    1,动态模型模式 function Person (name,age,job) { this.name=name; this.age=age; this.job=job; if(typeof this ...

  4. Unity3D中使用委托和事件

    前言: 本来早就想写写和代码设计相关的东西了,以前做2DX的时候就有过写写观察者设计模式的想法,但是实践不多.现在转到U3D的怀抱中,倒是接触了不少委托事件的写法,那干脆就在此总结一下吧. 1.C#中 ...

  5. 说一说javascript跨域和jsonp

    同源策略 在浏览器的安全策略中“同源策略”非常如雷贯耳,说的是协议.域名.端口相同则视为同源,域名也可换成IP地址,不同源的页面脚本不能获取对方的数据. 要是想使用XMLHttpRequest或者常规 ...

  6. 仅此一文让你明白ASP.NET MVC原理

    ASP.NET MVC由以下两个核心组成部分构成: 一个名为UrlRoutingModule的自定义HttpModule,用来解析Controller与Action名称: 一个名为MvcHandler ...

  7. webParts与Web部件

    web部件是ASP.NET WebForm里面的服务器控件,它涵盖的内容比较多,鉴于这种状况的话鄙人不打算深究下去了,只是局限于了解web.config配置里面的配置内容则可. 那么也得稍微说说啥是W ...

  8. Ionic 简单操作

    在使用 Ionic 之前要安装 Nodejs,Cordova . Java 下载Java 网站.Java 默认安装在 C:\Program Files\Java 文件目录. Android 下载And ...

  9. java泛型基础

    泛型是Java SE 1.5的新特性, 泛型的本质是参数化类型, 也就是说所操作的数据类型被指定为一个参数. 这种参数类型可以用在类.接口和方法的创建中, 分别称为泛型类.泛型接口.泛型方法.  Ja ...

  10. spider RPC开发指南

    协议与兼容性 spider使用java语言开发,使用Spring作为IoC容器,采用TCP/IP协议,在此基础上,结合SaaS系统模式的特性进行针对性和重点设计,以更加灵活和高效的满足多租户系统.高可 ...