1. 回调函数

  优点: 解决了同步的问题(只要有一个任务耗时长后面的任务都会等待,会拖延程序执行)

  缺点: 回调地狱  不能用try  catch捕获  不能用 return

setTimeout(() => {
// callback 函数体
}, 1000)

  

2. promise

  优点: 解决了回调地狱问题

  缺点: 无法取消promise  错误需要通过回调函数捕获

ajax('XXX1', () => {
  // callback 函数体
  ajax('XXX2', () => {
    // callback 函数体
    ajax('XXX3', () => {
      // callback 函数体
    })
  })
})

ajax('XXX1')
  .then(res => {
    // 操作逻辑
    return ajax('XXX2')
  }).then(res => {
  // 操作逻辑
  return ajax('XXX3')
  }).then(res => {
  // 操作逻辑
})

  

3.Generator

  缺点:如果不适用执行器的情况可能阅读性会很差

  特点:可以控制函数的执行,可以配合co函数库使用

function *fetch() {
yield ajax('XXX1', () => {})
yield ajax('XXX2', () => {})
yield ajax('XXX3', () => {})
}
let it = fetch()
let result1 = it.next()
let result2 = it.next()
let result3 = it.next()

4. async/await

  优点: 代码清晰,不像promise一大堆   .then

  缺点:await将异步代码改造为同步代码,如果多个异步操作没有依赖性而使用await 会导致性能降低

async function test() {
// 以下代码没有依赖性的话,完全可以使用 Promise.all 的方式
await fetch('XXX1')
await fetch('XXX2')
await fetch('XXX3')
}

JS异步解决方案及优缺点的更多相关文章

  1. JS异步解决方案

    前言 异步最早的解决方案是回调函数,如ajax,事件的回调,setInterval/setTimeout中的回调.但是回调函数有回调地狱的问题; 为了解决回调地狱的问题,社区提出了Promise解决方 ...

  2. JS异步解决方案之概念理解-----------阻塞和非阻塞,同步和异步,并发和并行,单线程和多线程

    首先记住一句话,JS是单线程的. 单线程意味着什么?单线程意味着 它不能依靠自己实现异步. JS实现的异步,往往都是靠 浏览器.Node 的机制(事件驱动.回调)实现的. 下面让我这个单身狗 以谈恋爱 ...

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

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

  4. js async await 终极异步解决方案

    既然有了promise 为什么还要有async await ? 当然是promise 也不是完美的异步解决方案,而 async await 的写法看起来更加简单且容易理解. 回顾 Promise Pr ...

  5. 关于使用Iscroll.js异步加载数据后不能滑动到最底端的问题解决方案

    关于使用Iscroll.js异步加载数据后不能滑动到最底端,拉到最下边又弹回去的问题困扰了我老半天,相信很多朋友都遇到了.我刚好不小心解决了,和大家分享一下.由于各种忙,下边就直接上代码吧. (前提是 ...

  6. [转] js async await 终极异步解决方案

    阅读目录 回顾 Promise async await 字面理解 async.await 如何执行 await 操作符 总结 既然有了promise 为什么还要有async await ? 当然是pr ...

  7. js异步编程

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

  8. 关于JS异步加载方案

    javascript延迟加载的解决方案: 1.使用defer标签 <span style="font-size: small;"><script type=&qu ...

  9. js 异步流程控制之 avQ(avril.queue)

    废话前言 写了多年的js,遇到过最蛋疼的事情莫过于callback hell, 相信大家也感同身受. 业界许多大大也为此提出了很多不错的解决方案,我所了解的主要有: 朴灵 event proxy, 简 ...

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

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

随机推荐

  1. 【ACM算法竞赛日常训练】DAY1题解与分析

    DAY1 共四题: 月月查华华的手机:https://ac.nowcoder.com/acm/problem/23053 Rinne Loves Edges:https://ac.nowcoder.c ...

  2. AI工具导航

    .xe-comment-entry img { float: left; display: block; background: rgba(136, 136, 136, 0.15); margin-r ...

  3. Windows注册表中修改UAC(用户账号控制)及批处理脚

    我在windows电脑上安装软件时,或者设置开机启动软件时,会先弹出提示框: 用户账户控制 你要允许此应用对你的设备进行更改吗? 很烦人,我不想每次都提醒.需要关闭"用户账户控制" ...

  4. day96:flask:flask-migrate&flask-session&蓝图Blueprint&蓝图的运行机制&基于flask仿照django进行项目架构

    目录 1.flask-migrate 2.flask-session 3.蓝图:Blueprint 4.蓝图的运行机制 5.基于flask仿照django进行项目架构 1.准备工作 2.加载配置文件 ...

  5. day8:列表相关函数&深浅拷贝&字典相关函数&集合相关操作/函数

    字符串/列表/字典/集合 目录 字符串相关操作: 拼接 重复 跨行拼接 索引 切片字符串相关函数:常规11+is系列3+填充去除6+最重要3字符串拓展:字符串的格式化format 列表的相关操作:拼接 ...

  6. Generative Pre-trained Transformer(GPT)模型技术初探

    一.Transformer模型 2017年,Google在论文 Attention is All you need 中提出了 Transformer 模型,其使用 Self-Attention 结构取 ...

  7. Dokcer应用部署(搭建Wordpress网站)

    实现多个容器之间的协同,搭建Wordpress网站,要用到3个容器,Wordpress.MariaDB和Nginx 拉取镜像 使用docker pull拉取3个镜像: $ sudo docker pu ...

  8. AndroidApp加密数据明文抓取测试方法——hook方式

    0x00 前言 在做移动安全的app渗透或者说移动app的漏洞挖掘时,往往会碰到一种情况:好不容易绕过了app的反抓包机制,通过burp抓到了app传输的数据包,这时想对这部分数据做一些爆破.篡改之类 ...

  9. java Stack(栈)类、Queue和Deque队列

    1. java Stack类 特性是:LIFO(后进先出)先进后出,最先进入的在栈底. Stack底层也是通过数组实现的,同时也是线程安全的 Stack stack=new Stack(); //添加 ...

  10. Vue的项目打包为移动端(安卓手机应用)app

    现在基于vue全家桶技术体系,基本上可以开发各端的各种应用,pc端的应用,开发完成以后,直接运行打包命令 yarn build 即可打包,部署到服务器端上线即可.那么,今天我们来聊一聊,开发好的vue ...