如何在 JavaScript 中同步的执行异步代码

function sleep(ms: number) {
  return new Promise(res => {
    setTimeout(() => {
      res('sleep done')
    }, ms)
  })
}

async function test() {
  console.log(2)
  await sleep()
  console.log(3)
}

console.log(1)
test()
console.log(4)

// remarkPlugin 代码🌰
import { getHighlighter } from 'shiki'

export function shikiRemarkPlugin() {
  // 问题就是这的  getHighlighter 是返回的 Promise
  const highlighter = getHighlighter({
    theme: 'nord'
  })
  return function (tree, file) {
    // 遍历 tree 取到其中的 code 节点
    // 将其用 shiki highlighter.codeToHtml 转换成带主题的 html 代码
    // 然后将节点的 value 更新即可
  }
}

function sleep(n) {
  const status = Atomics.wait(new Int32Array(new SharedArrayBuffer(4)), 0, 0, n * 1000);
  console.log('Atomics.wait:', status)
}
console.log(1)
sleep(5)
console.log(2) // 5秒后输出

// example sync-util.mjs
import {
  MessageChannel,
  Worker,
  receiveMessageOnPort,
  workerData,
  parentPort,
} from 'node:worker_threads'

// 创建需要异步执行的 代码文件， 返回执行函数
export function createSyncFn(path) {
  // 初始化一个 MessageChannel 用于线程通信
  const { port1: mainPort, port2: workerPort } = new MessageChannel()
  const worker = new Worker(path, {
    workerData: {
      workerPort
    },
    transferList: [workerPort],
  })
  // 将worker类似挂起
  worker.unref();

  // 返回 执行方法
  return (...args) => {
    const sharedBuffer = new SharedArrayBuffer(4)
    const sharedBufferView = new Int32Array(sharedBuffer)

    // 向worker 发送消息 将 参数 和 共享的数据发送
    worker.postMessage({
      args,
      sharedBuffer
    })

    // 等待共享变动通知
    const status = Atomics.wait(sharedBufferView, 0, 0)

    if (!['ok', 'not-equal'].includes(status)) {
      throw new Error('Internal error: Atomics.wait() failed: ' + status)
    }

    // 收到 woker 发来的消息
    const { message } = receiveMessageOnPort(mainPort)

    return message
  }
}

// 在异步代码中调用 fn 为要执行方法
export function runWoker(fn) {
  const { workerPort } = workerData

  try {
    // 等待接收 主线程的消息
    parentPort.on('message', async ({args, sharedBuffer}) => {
      // 收到消息
      const sharedBufferView = new Int32Array(sharedBuffer)

      // 执行异步方法
      const res = await fn(...args)

      // 将异步的结果发送给主线程
      workerPort.postMessage(res)
      // 更改共享数据
      Atomics.add(sharedBufferView, 0, 1)
      // 通知共享数据发生更改
      Atomics.notify(sharedBufferView, 0)
    })
  } catch (e) {
    console.log(e);
  }
}

// index.mjs 
import { createSyncFn } from './sync.mjs'

const run = createSyncFn('./async-fn.mjs')

console.time('test time')
console.log('start')

const res = run(2000)
console.log('sync res: ', res)

const res2 = run(3000)
console.log('sync res2: ', res2)

console.log('end')
console.timeEnd('test time')

// async-fn.mjs
import { runWoker } from "./sync.mjs";

function sleep(ms) {
  return new Promise((res) => {
    setTimeout(() => res('sleep done:' + ms), ms)
  })
}

runWoker(async (...args) => {
  return sleep(...args)
})