ES6 --- JS异步编程的几种解决方法及其优缺点
导言:
我们都知道 JS 是单线程的,这也正是异步编程对于 JS 很重要的原因,因为它无法忍受耗时太长的操作。正因如此有一系列的实现异步的方法。
方法一 setTimeout
常用于:定时器,动画效果
用法:setTimeout(func|code,delay)
缺点:
setTimeout 的主要问题在于,它并非那么精确。譬如通过 setTimeout() 设定一个任务在 10 毫秒后执行,但是在 9 毫秒之后,有一个任务占用了 5 毫秒的 CPU 时间片,再次轮到定时器执行时,时间就已经过期 4 毫秒
方法二 事件监听
任务的执行不取决于代码的顺序,而取决于某个事件是否发生
用法:f1.on('done',f2);
优点:比较容易理解,可以绑定多个事件,每个事件可以指定多个回调函数,而且可以"去耦合",有利于实现模块化;
缺点:整个程序都要变成事件驱动型,运行流程会变得很不清晰;
方法三 回调函数
什么是回调函数?
JavaScript语言对异步编程的实现,就是回调函数。所谓回调函数,就是把任务的第二段单独写在一个函数里面,等到重新执行这个任务的时候,就直接调用这个函数;
误区:
回调函数是实现 JS 异步的一种方法,并不是说回调函数就是异步的。
只是我们用的大多数回调函数都是用于异步
异步的定义:
在javascript中,回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式),就叫做匿名回调函数。
回调函数的缺点:(想想,如果再嵌套多几层,代码会变得难以理解,俗称"回调函数噩梦(callback hell)");
回调函数本身并没有问题,它的问题出现在多个回调函数嵌套。
假定读取A文件之后,从A文件中获取B文件名,再读取B文件,
方法四 Promise对象
Promise原本只是社区提出的一个构想,一些外部函数库率先实现了这个功能。ES6将其写入语言标准,因此目前 JavaScript 语言原生支持 Promise 对象,假设要依次读取多个文件,如果用普通的回调函数,就会出现多重嵌套。代码不是纵向发展,而是横向发展;
Promise的优缺点:
优点:Promise 的写法是回调函数的改进,使用then方法以后,异步任务的两段执行看得更清楚了。then将原来异步函数的嵌套关系转变为链式步骤;
缺点:Promise 的最大问题是代码冗余,原来的任务被Promise包装了一下,不管什么操作,一眼看去都是一堆 then,原来的语义变得很不清楚;
所以,ES6在把 Promise 纳入标准的同时,也提供了另一种实现 => Generator 函数
ES6 --- JS异步编程的几种解决方法及其优缺点的更多相关文章
- node.js异步编程的几种模式
Node.js异步编程的几种模式 以读取文件为例: 1.callback function const fs = require('fs'); //callback function fs.readF ...
- 火狐浏览器如何js关闭窗口的几种解决方法
今天在项目上有一个页面要求在几秒后自动关闭,想着还比较简单,用window.close()就可以了,但是用IE/谷歌/火狐浏览器试了一下,发现IE可以,谷歌用网上的兼容方法也可以实现,但是火狐这里卡住 ...
- Javascript教程:js异步模式编程的4种解决方法
随着人们对网站视觉效果及用户体验的要求越来越高,所以在未来网站的建设中,设计师们开始越来越多的使用了js文件来达到预期的效果,随着js文件的越来越多,令设计师们最头痛的事情也就来了,那就是Javasc ...
- 前端分享----JS异步编程+ES6箭头函数
前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...
- js异步编程
前言 以一个煮饭的例子开始,例如有三件事,A是买菜.B是买肉.C是洗米,最终的结果是为了煮一餐饭.为了最后一餐饭,可以三件事一起做,也可以轮流做,也可能C需要最后做(等A.B做完),这三件事是相关的, ...
- JS异步编程 (2) - Promise、Generator、async/await
JS异步编程 (2) - Promise.Generator.async/await 上篇文章我们讲了下JS异步编程的相关知识,比如什么是异步,为什么要使用异步编程以及在浏览器中JS如何实现异步的.最 ...
- JS异步编程 (1)
JS异步编程 (1) 1.1 什么叫异步 异步(async)是相对于同步(sync)而言的,很好理解. 同步就是一件事一件事的执行.只有前一个任务执行完毕,才能执行后一个任务.而异步比如: setTi ...
- 一个例子读懂 JS 异步编程: Callback / Promise / Generator / Async
JS异步编程实践理解 回顾JS异步编程方法的发展,主要有以下几种方式: Callback Promise Generator Async 需求 显示购物车商品列表的页面,用户可以勾选想要删除商品(单选 ...
- JS魔法堂:深究JS异步编程模型
前言 上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...
随机推荐
- Java知多少(101)图像缓冲技术
当图像信息量较大,采用以上直接显示的方法,可能前面一部分显示后,显示后面一部分时,由于后面一部分还未从文件读出,使显示呈斑驳现象.为了提高显示效果,许多应用程序都采用图像缓冲技术,即先把图像完整装入内 ...
- Centos7 中lvs DR配置
服务器主机: 10.200.3.100 DirectServer 10.200.3.99 RealServer1 10.200.3.101 RealServer2 10.2 ...
- PHP最全笔记(二)(值得收藏,不时翻看一下)
/* [goto]5.3+ 版本 */用来跳转到程序中的某一指定位置该目标位置可以用目标名称 加上冒号来标记.PHP中的goto有一定限制,只能在同一个文件和作用域中跳转, 也就是说你无法跳出一 ...
- [Android Studio] Using API of OpenCV DNN
前言 一.故事背景 NDK方法人脸识别 OpenCV4Android系列: 1. OpenCV4Android开发实录(1):移植OpenCV3.3.0库到Android Studio 2.OpenC ...
- Fidder
第一步:下载Fiddler,下载链接: http://fiddler2.com/get-fiddler 下载完成之后,傻瓜式的安装一下了! 第二步:设置Fiddler 打开Fiddler, Tools ...
- android中volley通信框架简介
1. 什么是Volley? 在这之前,我们在程序中需要和网络通信的时候,大体使用的东西莫过于AsyncTaskLoader,HttpURLConnection,AsyncTask,HTTPClient ...
- python 如何在一个.py文件中调用另一个.py文件的类
如果是在同一个 module中(也就是同一个py 文件里),直接用就可以如果在不同的module里,例如a.py里有 class A:b.py 里有 class B:如果你要在class B里用cla ...
- Qt编写通用主界面V2019
其实是2018年做出来的这个界面效果,用该界面做了三四个项目,今天抽空特意提取出来单独的demo,集成到了皮肤生成器中.
- celery 原理理解
这里有一篇写的不错的:http://www.jianshu.com/p/1840035cb510 自己的“格式化”后的内容备忘下: 我们总在说c10k的问题, 也做了不少优化, 然后优化总是不够的. ...
- 7.17python
1.事件: # !/usr/bin/env python # !--*--coding:utf-8 --*-- # !@Time :2018/7/17 10:38 # !@Author TrueNew ...