Skip to content
大纲

eventloop源码阅读

任务类型

参考资料1

参考资料2

尝试自己模拟一个eventloop(供参考)

js
// 定义任务队列
const taskQueue = []

// 定义 Promise 队列
const promiseQueue = []

// 定义是否正在执行任务的标志
let isTaskRunning = false

// 定义事件循环函数
function eventLoop() {
  // 如果任务队列为空,或者正在执行任务,则直接返回
  if (taskQueue.length === 0 || isTaskRunning) {
    return
  }
  
  // 取出队列中的第一个任务
  const task = taskQueue.shift()

  // 执行任务
  isTaskRunning = true
  task().then(() => {
    // 任务执行完成后,设置执行标志为 false,并递归调用事件循环函数
    isTaskRunning = false
    eventLoop()
  })
}

// 定义 setTimeout 函数
function mySetTimeout(callback, timeout) {
  // 创建一个延迟执行的任务
  const task = () => new Promise(resolve => setTimeout(() => resolve(callback()), timeout))
  
  // 将任务添加到任务队列中
  taskQueue.push(task)
  
  // 启动事件循环
  eventLoop()
}

// 定义 Promise 函数
function myPromise(fn) {
  // 创建一个 Promise 对象,并将它添加到 Promise 队列中
  const promise = new Promise(fn)
  promiseQueue.push(promise)
  
  // 启动事件循环
  eventLoop()
  
  // 返回 Promise 对象
  return promise
}

// 示例代码
console.log('start')

mySetTimeout(() => console.log(1), 2000)
myPromise(resolve => setTimeout(() => resolve(2), 1000))
  .then(result => console.log(result))
mySetTimeout(() => console.log(3), 0)

console.log('end')