js是单线程脚本语言脚本语言？jswhy？微任务（microtask）

  js是单线程脚本语言 why？

  js作为主要运行在浏览器的脚本语言，js主要用途之一是操作DOM。如果js同时有多个线程，同时对同一个dom进行操作，这时浏览器应该听哪个线程的，如何判断优先级呢？为了避免这种问题，js必须是一门单线程语言；

  因此，js在同一时间，只能做同一件事，为了协调事件、用户交互、脚本、UI渲染和网络处理等行为，防止主线程阻塞，Event Loop应运而生；

  什么是 EventLoop？

  Event Loop顾名思义：“事件循环”js单线程 ui渲染，是指浏览器或Node环境的一种解决javaScript单线程运行时阻塞问题的一种机制，也就是实现异步的原理。

  js是单线程，所以js执行任务时要一个一个顺序执行。如果一个任务耗时过长，那么后一个任务也必须等着。那么问题来了，假如我们购物逛淘宝时，高清图片很多，加载很慢，难道我们的网页要一直卡着直到图片完全显示出来？答案是否定的。于是，事件就被分为了：

  1.同步事件

  2.异步事件

  异步事件又包含：宏任务（macrotask），微任务（microtask）；

  任务执行流程是怎样的呢？

  如图：

  异步任务之“微任务(microtask)”

  一般认为包含以下三种：

  异步任务之“宏任务(macrotask)”

  我们将javascript中非微任务（MircoTask）的所有任务都归为宏任务，比如：

  微任务和宏任务皆为异步任务，它们都属于一个队列，主要区别在于他们的执行顺序

  如图：

  代码演示

   console.log(1);

 setTimeout(function() {
console.log(2);
 }, 0);
 new Promise(function(resolve){
  console.log(3);
  resolve(4)
 }).then(function(res){
  console.log(res)
 })
 console.log(5);

  解读：1.先执行script同步代码，执行同步任务，输出1，3，5；

  2.将setTimeout 和Promise 加入队列中；

  3.执行微任务promise.then 输出4，没有其他微任务了；

  4.执行宏任务 setTimeout，输出 2；

  故最后输出为：1，3，5，4，2；

  课堂练习

  经典面试题：

   console.log('1');

 setTimeout(function() {
  console.log('2');
  process.nextTick(function() {
console.log('3');
  })
  new Promise(function(resolve) {
console.log('4');
resolve();
  }).then(function() {
console.log('5')
  })
 })
 process.nextTick(function() {
  console.log('6');
 })
 new Promise(function(resolve) {
  console.log('7');
  resolve();
 }).then(function() {
  console.log('8')
 })
 setTimeout(function() {
  console.log('9');
  process.nextTick(function() {
console.log('10');
  })
  new Promise(function(resolve) {
console.log('11');
resolve();
  }).then(function() {
console.log('12')
  })
 })

  输出结果为：1，7，6，8，2js单线程 ui渲染，4，3，5，9，11，10，12；

  备注：process在浏览器控制台会报错，在浏览器执行时可删除process.nextTick

  大家都做对了吗？有哪里不对的地方，欢迎大家指出！