javascript同步和异步的区别与实现方式
javascript语言是单线程机制。所谓单线程就是按次序执行,执行完一个任务再执行下一个。
对于浏览器来说,也就是无法在渲染页面的同时执行代码。
单线程机制的优点在于实现起来较为简单,运行环境相对简单。缺点在于,如果中间有任务需要响应时间过长,经常会导致
页面加载错误或者浏览器无响应的状况。这就是所谓的“同步模式”,程序执行顺序与任务排列顺序一致。对于浏览器来说,
同步模式效率较低,耗时长的任务都应该使用异步模式;而在服务器端,异步模式则是唯一的模式,如果采用同步模式个人认为
服务器很快就会出现12306在高峰期的表现。。。。
异步模式的四种方式:
1.回调函数callback
所谓回调函数,就是将函数作为参数传到需要回调的函数内部再执行。
典型的例子就是发送ajax请求。例如:
$.ajax({
async: false,
cache: false,
dataType: 'json',
url: "url",
success: function(data) {
console.log('success');
},
error: function(data) {
console.log('error');
}
})
当发送ajax请求后,等待回应的过程不会堵塞程序运行,耗时的操作相当于延后执行。
回调函数的优点在于简单,容易理解,但是可读性较差,耦合度较高,不易于维护。
2.事件驱动
javascript可以称之为是基于对象的语言,而基于对象的基本特征就是事件驱动(Event-Driven)。
事件驱动,指的是由鼠标和热键的动作引发的一连串的程序操作。
例如,为页面上的某个绑定click事件;
$('#btn').onclick(function(){
console.log('click button');
});
绑定事件相当于在元素上进行监听,是否执行注册的事件代码取决于事件是否发生。
优点在于容易理解,一个元素上可以绑定多个事件,有利于实现模块化;但是缺点在于称为事件驱动的模型后,流程不清晰。
3.发布/订阅
发布订阅模式(publish-subscribe pattern)又称为观察者模式(Observer pattern)。
该模式中,有两类对象:观察者和目标对象。目标对象中存在着一份观察者的列表,当目标对象
的状态发生改变时,主动通知观察者,从而建立一种发布/订阅的关系。
jquery有相关的插件,在这不是重点不细说了。。。。回头写个实现贴上来
4.promise模式
promise对象是CommonJS工作组提供的一种规范,用于异步编程的统一接口。
promise对象通常实现一种then的方法,用来在注册状态发生改变时作为对应的回调函数。
promise模式在任何时刻都处于以下三种状态之一:未完成(unfulfilled)、已完成(resolved)和拒绝(rejected)。以CommonJS Promise/A 标准为例,promise对象上的then方法负责添加针对已完成和拒绝状态下的处理函数。then方法会返回另一个promise对象,以便于形成promise管道,这种返回promise对象的方式能够支持开发人员把异步操作串联起来,如then(resolvedHandler, rejectedHandler); 。resolvedHandler 回调函数在promise对象进入完成状态时会触发,并传递结果;rejectedHandler函数会在拒绝状态下调用。
Jquery在1.5的版本中引入了一个新的概念叫Deferred,就是CommonJS promise A标准的一种衍生。可以在jQuery中创建
$.Deferref的对象。同时也对发送ajax请求以及数据类型有了新的修改,参考JQuery API。
javascript同步和异步的区别与实现方式的更多相关文章
- AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法?
AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法? 分类: web前端面试题2013-07-20 22:40 630人阅读 评论(0) 收藏 举报 目录(? ...
- Ajax 的概念及过程?Ajax 的交互模型?同步和异步的区别?如何解决跨域问题?
Ajax 是什么: 1) 通过异步模式,提升了用户体验 2) 优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用 3) Ajax 在客户端运行,承担了一部分本来由服务器承担的工 ...
- ajax同步与异步的区别
jquery中ajax方法有个属性async用于控制同步和异步,默认是true,即ajax请求默认是异步请求,有时项目中会用到AJAX同步.这个同步的意思是当JS代码加载到当前AJAX的时候会把页面里 ...
- Ajax 是什么?Ajax 的交互模型?同步和异步的区别?如何解决跨域问题?以及 HTTP状态码
一.Ajax 是什么: 1. 通过异步模式,提升了用户体验 2. 优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用 3. Ajax 在客户端运行,承担了一部分本来由服务器承担的工作 ...
- Java常见的同步和异步的区别、特点、联系
Java常见的同步和异步的区别.特点.联系 同步:发送一个请求,等待返回,然后再发送下一个请求 异步:发送一个请求,不等待返回,随时可以再发送下一个请求 同步可以避免出现死锁,读脏数据的发生,一般 ...
- [Xcode 实际操作]八、网络与多线程-(23)多线程的同步与异步的区别
目录:[Swift]Xcode实际操作 本文将演示线程的同步与异步的区别. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] 异步线程的运行,是没有按照顺序执行的. ...
- ajax 同步和异步的区别
举个例子:普通B/S模式(同步)AJAX技术(异步)同步:提交请求->等待服务器处理->处理完毕返回 这个期间客户端浏览器不能干任何事异步: 请求通过事件触发->服务器处理(这时浏览 ...
- JQ Ajax 同步与异步的区别
$.ajax({ url: xml_addr, type: 'get', dataType: 'xml', timeout: 1000, //设定超时 cache: false, //禁用缓存 asy ...
- AJAX中同步和异步的区别和使用场景
一.简介Ajax请求最重要的问题是代码执行的顺序.最长遇到的问题是,我们定义一个变量接收ajax异步请求的返回结果,后续代码使用,然而后续代码在使用时该变量为初始值,始终得不到想要的结果!!!二.示例 ...
随机推荐
- VS2010 不显示 最近使用的项目 解决办法(转)
昨天重装了VS2010,然后开了项目看了下今天早上再打开发现起始页近使用项目列表是空白的,每次打开项目都要去到指定目录去找解决方案才能打开,感觉很麻烦,在网上找了下解决方案,解决步骤下:菜单 —— 运 ...
- [转]SE43 修改SAP标准菜单、登陆界面、背景图片
1.事务码se43 复制标准菜单S000 到 ZS000 2.按实际需要修改 ZS000 3.在事务码SSM2中用ZS000 代替 S000 4.注销后重新登陆 o 修改SAP登陆界面(在本博客 ...
- Eclipse项目中乱码问题的解决办法
一.产生的原因: 1.Http协议进行通信的时候是基于请求和响应的,传输的内容我们称之为报文! 2.Http协议会按照一定的规则将报文编码,然后在读取的时候再使用响应的解码格式进行解码! 3.这个一定 ...
- 防止表单submit或按钮button多次连续点击提交
如上例子:当我点击提交按钮触发submitQuartz()函数 防止用户连续点击提交操作 方法一:获取当时点击时间,根据时间差判断 $scope.submitQuartz=function () { ...
- Sqlyog问题
Sqlyog没有架构设计器的解决方法 更换注册码即可
- vue-cli 使用sass(scss)
安装依赖: npm install sass-loader node-sass vue-style-loader --save-dev
- thinkphp5控制器访问转换问题
假设定义了HelloWorld控制器 url访问地址就是:http://localhost/index.php/index/hello_world,与此同时view目录下的模板文件夹要命名为hello ...
- PAT甲级——1099 Build A Binary Search Tree (二叉搜索树)
本文同步发布在CSDN:https://blog.csdn.net/weixin_44385565/article/details/90701125 1099 Build A Binary Searc ...
- maven项目打包分析及打包后war包缺少配置文件报错的原因分析,使用progard混淆时配置分析
1.maven打包: 一直以来我都没太注意过在myeclipse下使用run as来clean居然对项目的target目录没有进行操作,要让操作有效,需要进入到maven build...选项下,进行 ...
- POJ1024 Tester Program
题目来源:http://poj.org/problem?id=1024 题目大意: 有一个迷宫,迷宫的起点在(0,0)处.给定一条路径,和该迷宫墙的设置,要求验证该路径是否为唯一的最短路径,该种墙的设 ...