js中同步与异步

时间:2021-05-16 23:41:07

我们都知道原生ajax中,是异步请求,是多个同时进行,不能解决跨域问题,但是在jquery中ajax中封装了async属性,当属性值为true表示是异步,false表示同步;一般请求ajax,一般不写async的值,一般采用默认值异步,对请求到的数据,一般在success回调函数进行处理,如有特殊情况,我们在请求ajax完后,再进行数据处理(意思就是在ajax对象外部进行数据处理),一般这种情况很少见,我将async设置成为fasle,表示异步,就能在对象外部对数进行处理,一般不推荐这么做,浏览器也会已警告处理;

                   js中同步与异步

数据处理一般在成功回调函数中进行数据;这就是jquery中同步异步的问题,当然在讲同步异步问题,还要讲到js脚本的解析机制;就是单线程和多线程的问题;


Javascript语言的执行环境是"单线程"(single thread)。

所谓"单线程",就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。

这种模式的好处是实现起来比较简单,执行环境相对单纯;坏处是只要有一个任务耗时很长,后面的任务都必须排队等着,会拖延整个程序的执行。常见的浏览器无响应(假死),往往就是因为某一段Javascript代码长时间运行(比如死循环),导致整个页面卡在这个地方,其他任务无法执行。

为了解决这个问题,Javascript语言将任务的执行模式分成两种:同步(Synchronous)和异步(Asynchronous)。

"同步模式"就是上一段的模式,后一个任务等待前一个任务结束,然后再执行,程序的执行顺序与任务的排列顺序是一致的、同步的;"异步模式"则完全不同,每一个任务有一个或多个回调函数(callback),前一个任务结束后,不是执行后一个任务,而是执行回调函数,后一个任务则是不等前一个任务结束就执行,所以程序的执行顺序与任务的排列顺序是不一致的、异步的。

"异步模式"非常重要。在浏览器端,耗时很长的操作都应该异步执行,避免浏览器失去响应,最好的例子就是Ajax操作。在服务器端,"异步模式"甚至是唯一的模式,因为执行环境是单线程的,如果允许同步执行所有http请求,服务器性能会急剧下降,很快就会失去响应。


异步调用并不会阻止代码的顺序执行,而是在将来的某一个时刻触发设置好的逻辑,所以我们
  1. 并不知道逻辑什么时候会被调用
  2. 只能定义当触发的时候逻辑是什么
  3. 只能等待,同时可以去处理其他的逻辑

setTimeout就是这样的一个异步调用。

js中同步与异步


可以看出来代码的执行过程确实是先执行了f1函数,再进行console输出,但是setTimeout的回调函数却在执行过程中被挂起,直到1s过后才被调用。在等待过程中javascript选择先执行后面的操作,即console输出。

实际上,异步函数,如setTimeout和setInterval,是被压入了称之为Event Loop的队列。

Event Loop是一个回调函数队列。当异步函数执行时,回调函数会被压入这个队列。JavaScript引擎直到异步函数执行完成后,才会开始处理事件循环。这意味着JavaScript代码不是多线程的,即使表现的行为相似。事件循环是一个先进先出(FIFO)队列,这说明回调是按照它们被加入队列的顺序执行的。JavaScript被 node选做为开发语言,就是因为写这样的代码多么简单啊。

Node.js 使用事件驱动模型,当web server接收到请求,就把它关闭然后进行处理,然后去服务下一个web请求。当这个请求完成,它被放回处理队列,当到达队列开头,这个结果被返回给用户。这个模型非常高效可扩展性非常强,因为webserver一直接受请求而不等待任何读写操作。(这也被称之为非阻塞式IO或者事件驱动IO)在事件驱动模型中,会生成一个主循环来监听事件,当检测到事件时触发回调函数。


整个事件驱动的流程就是这么实现的,非常简洁。有点类似于观察者模式,事件相当于一个主题(Subject),而所有注册到这个事件上的处理函数相当于观察者(Observer)。


想要更多知道关于异步和同步的问题,请看阮一峰老师的如何解决的:http://www.ruanyifeng.com/blog/2014/10/event-loop.html