js--js引擎的执行机制

目录

1.js为什么是单线程的？

2.js中为什么需要异步？

3.单线程如何实现异步？

[1]编译器的工作原理

基础知识

[1]同步与异步定义

[2]同步与异步的区别

[3]进程与线程

[4]面试题

---

1.js为什么是单线程的？

这主要和js的用途有关，js作为浏览器的脚本语言，主要是实现用户与浏览器的交互，以及操作dom的，这决定了js只能是单线程；

想一下如下场景

• 若是js是多线程的
  • 现在有两个线程，p1,p2
  • p1,p2想操作同一个dom元素，一个执行删除操作，一个执行修改操作；
  • 那么，我们应该听哪一个的呢？
  • 因此，这就意味这js只能是单线程；

2.js中为什么需要异步？

很多操作是需要大量时间的，比如说定时器可能间隔1分钟甚至更多，若是同步代码的话会造成阻塞线程；

而对于用户而言，阻塞就意味着‘卡死’，导致用户体验度降低；

解决：js中存在异步！

3.单线程如何实现异步？

• 单线程：JavaScript 同时只能执行一个任务，其他任务都必须在后面排队等待。js必须执行上一行才能执行下一行;

• 任务队列：JavaScript 运行时，除了一个正在运行的主线程，引擎还提供一个任务队列，里面是各种需要当前程序处理的异步任务(不能操作Dom)；

• 异步任务：异步任务是那些被引擎放在一边，不进入主线程、而进入任务队列的任务。

• 异步任务的执行时机：主线程会去执行所有的同步任务。等到同步任务全部执行完，就会去看任务队列里面的异步任务是否可以执行，只有引擎认为某个异步任务可以执行了（比如 Ajax 操作从服务器得到了结果），该任务（采用回调函数的形式）才会进入主线程执行。排在异步任务后面的代码，不用等待异步任务结束会马上运行，也就是说，异步任务不具有“堵塞”效应。

• JavaScript 引擎怎么知道异步任务有没有结果，能不能进入主线程呢：引擎在不停地检查，一遍又一遍，只要同步任务执行完了，引擎就会去检查那些挂起来的异步任务，是不是可以进入主线程了。这种循环检查的机制，就叫做事件循环（Event Loop）

[1]编译器的工作原理

• 1.编译器从上往下顺序依次解析(解析不是执行)代码；

• 2.在解析代码的过程中，判断是同步操作还是异步操作；

  • 同步：立即执行(阻塞进程)

  • 异步： 放入事件队列池中( Event Loop)，等待所有同步执行完毕再执行异步事件；

• 3.举例说明

• // 代码
  const fs = require('fs')
  console.log(1111)
  setTimeout(function () {
    console.log(2222)
  }, 1000)
  fs.writeFile('./文件/02b.txt', '3333', err => {
    console.log(3333)
  })
  console.log(4444)
  ​
  setTimeout(function () {
    console.log(5555)
  }, 1000)
  // 运行结果
  // 1 ，4 ，3 ，2 ，5
  // 执行原理
  # [1]编译器先从上往下依次进行编译，判断是同步还是异步
  // 1111  同步立即执行
  // 2222  编译到setTimeout 异步(异步指的是函数是异步的)放入事件队列池
  // 3333  编译到writeFile是异步(异步指的是回调函数是异步的)放入事件队列池
  //。。。。
  #[2]异步放入事件队列池·，同步立即执行
  #[3]等待所有同步事件执行完毕再执行异步

基础知识

[1]同步与异步定义

• 同步

  • 同步就是指一个线程再执行某个请求的时候，若该请求需要一段时间才能返回信息，那么这个线程将会一直等待下去，直到收到返回信息才继续执行下去；

  • 同步会阻塞线程；

• 异步

  • 异步是指进程不需要一直等下去，而是继续执行下面的操作。当有消息返回时系统会通知进程进行处理

  • 异步不会阻塞线程，提高执行效率；

[2]同步与异步的区别

• API

  • 同步具有回调函数

    • 注：并不是拥回调函数的都是异步

• 执行顺序

  • 同步是从上往下有序执行

  • 异步无序，且等待所有的同步都执行完毕再执行异步

• 性能

  • 同步会阻塞线程，效率低

  • 异步不会阻塞线程，效率高

[3]进程与线程

• 进程

  • 进程是CPU进行资源分配的基本单位

  • eg:当我们要运行一个js页面的时候，cpu会分配一块内存

• 线程

  • 线程是CPU调度的最小单位；

  • 线程是依附于进程存在的;

[4]面试题

(1)面试题1

var t=true;
setTimeout(function(){
    t=false;
},1000);
white(t){}
alert('end');
说出运行结果---陷入死循环

（2）面试题2

var t=true;
white(t){
setTimeout(function(){
    t=false;
},1000);
}
alert('end');
说出运行结果

​