event loop

• JS 是一个单线程语言
• 异步和多线程是通过event loop 事件循环机制 来实现的
• 1.调用栈（call stack）
• 2.消息队列 （message queue）
• 3.微任务队列 （microtask queue）

最开始的时候在全局调用栈中 一行一行执行
遇到函数执行会把它压入调用栈中；当函数返回后（执行完之后）会从调用栈中移出

定时器 会被扔到消息队列中，消息队列会再调用栈清空的时候才去执行
  created () {
    this.fun2()
  },
  methods: {
    fun1 () {
      console.log(1);
    },
    fun2 () {
      setTimeout(() => {
        console.log(2);
      }, 0)
      this.fun1()
      console.log(3);
    }
  }
  上面代码 调用func2  输出的是 1 3 2
  分析：func2从上到下执行 
  遇到定时器，扔进消息队列中 不会被立即执行尽管设置的是0秒
  执行func1  打印1
  打印3
  调用栈中没有可执行的东西了 消息队列中的内容被压入调用栈中 执行定时器打印2 清空调用栈
  1 3 2

• 使用Promise async awite 这些异步会被压入微任务队列执行

微任务队列原理和定时器一样  优先级高于 消息队列
调用栈清空的时候先去执行微任务队列中的任务 --- 之后消息队列中的任务
created () {
    this.p = new Promise(resolve => {
      console.log(4);
      resolve(5)
    })
    this.fun2()

  },
  methods: {
    fun1 () {
      console.log(1);
    },
    fun2 () {
      setTimeout(() => {
        console.log(2);
      })
      this.fun1()
      console.log(3);
      this.p.then(resolved => {
        console.log(resolved);
      })
        .then(() => {
          console.log(6);
        })
    }
  }
 分析1.首先Promise 压入调用栈 执行 打印 4
 	2.resolve(5) 进入微任务队列  等待执行
    3.执行func2  定时器进入消息队列 等待执行
    4.调用func1  打印 1  func1移出调用栈
    5.打印 3 
    6.调用栈清空   开始执行微任务队列  打印 5 6
    7.最后执行消息队列   打印2  
    结果是 4 1 3 5 6 2