JS的同步异步问题

196 阅读2分钟

一、单线程

其实按着我们所知道的java,.net都是多线程语言,而在我们前端中javascript语言则不同,JavaScript是一门单线程的语言,因此,JavaScript在同一个时间只能做一件事,单线程就是,如果在同个时间有多个任务的话,这些任务就需要进行排队,前一个任务执行完,才会执行下一个任务。
比如说下面这段代码

function fun1() {
  console.log(1);
}
function fun2() {
  console.log(2);
}
fun1();
fun2();

输出的结果是:
1
2
可以看出,输出会依次输入1,2,因为代码是从上到下依次执行,执行完fun1(),才继续执行fun2()但是如果fun1()中的代码执行的是读取文件或者ajax操作,文件的读取和数据的获取都需要一定时间,要等到fun1()执行完才能继续执行fun2(),其实这个问题就涉及到了同步和异步的概念

同步异步的区别:
因为JavaScript的单线程,因此同个时间只能处理同个任务,所有任务都需要排队,前一个任务执行完,才能继续执行下一个任务,但是,如果前一个任务的执行时间很长,比如文件的读取操作或ajax操作,后一个任务就不得不等着,拿ajax来说,当用户向后台获取大量的数据时,不得不等到所有数据都获取完毕才能进行下一步操作,用户只能在那里干等着,严重影响用户体验,所以javjavascipscipt是单线程

那什么是异步任务呢?

异步任务是指不进入主线程,而进入任务队列的任务,只有任务队列通知主线程,某个异步任务可以执行了,该任务才会进入主线程,当我们打开网站时,像图片的加载,音乐的加载,其实就是一个异步任务

function fun1() {

  console.log(1);

}

function fun2() {

  console.log(2);

}

function fun3() {

  console.log(3);

}

fun1();

setTimeout(function(){

  fun2();

},0);

fun3();

输出的结果是
1

3

2
有了异步,就算fun2()里面是文件的读取或ajax这种需要耗时的任务,也不怕fun3()要等到fun2()执行完才能执行啦

JavaScript的异步机制包括以下几个步骤

(1)所有同步任务都在主线程上执行,行成一个执行栈 ;

(2)主线程之外,还存在一个任务队列,只要异步任务有了结果,就会在任务队列中放置一个事件 ;

(3)一旦执行栈中的所有同步任务执行完毕,系统就会读取任务队列,看看里面还有哪些事件,那些对应的异步任务,于是结束等待状态,进入执行栈,开始执行 ;

(4)主线程不断的重复上面的第三步;

那么怎么异步编程呢?咱们下回再详解