async/await 转换需识别阻塞点并提取 promise 操作，方法包括：一、手动重构用 await 替代 then；二、babel 插件编译降级；三、eslint 插件提示修复；四、jscodeshift 批量重写；五、vs code 扩展交互转换。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
如果您有一段使用回调或 Promise.then() 编写的同步风格 JavaScript 代码，但希望将其转换为更清晰、可读性更强的 async/await 模式，则需识别阻塞点、提取 Promise 化操作，并重构控制流。以下是多种可行的改写方法：
一、手动重构：识别 Promise 返回值并用 await 替代 then
该方法适用于已存在基于 Promise 的函数（如 fetch、axios.get、自定义返回 Promise 的工具函数），通过逐层替换 .then() 链为 await 表达式，消除嵌套并提升线性可读性。
1、确认原函数返回 Promise 实例，例如 const res = await fetch(url) 而非 fetch(url).then(...)
2、将顶层函数声明添加 async 关键字，如 function getData() → async function getData()
3、在每个 Promise 调用前插入 await，例如 const data = await promiseFn() 替代 promiseFn().then(data => {...})
4、用 try/catch 包裹 await 表达式以捕获异常，替代 .catch() 链
二、使用 Babel 插件 @babel/plugin-transform-async-to-generator 进行编译时转换
该方法适用于需要兼容旧版运行时环境的项目，Babel 可将 async/await 语法自动降级为 generator + Promise 的等效实现，无需手动修改逻辑结构。
1、安装插件：npm install --save-dev @babel/plugin-transform-async-to-generator
2、在 babel.config.js 的 plugins 数组中添加 '@babel/plugin-transform-async-to-generator'
3、确保 @babel/preset-env 已启用且 targets 配置覆盖目标环境
4、运行 Babel 编译后，源码中所有 async 函数将被转译为可执行的 regeneratorRuntime 兼容代码
三、借助 ESLint 插件 eslint-plugin-promise 和辅助规则自动提示
该方法不直接改写代码，而是通过静态分析识别可升级为 async/await 的 Promise 链模式，并提供快速修复建议，适合在 IDE 中实时辅助重构。
1、安装插件：npm install --save-dev eslint-plugin-promise
2、在 .eslintrc.js 的 plugins 字段加入 'promise'，rules 中启用 'promise/prefer-await-to-then'
3、保存文件时，VS Code 或 WebStorm 将在 .then() 链上显示灯泡图标，点击即可一键转换为 await 形式
4、对含多个 .catch() 或复杂链式调用的代码，插件会提示拆分或封装为独立 async 函数
四、使用 Codemod 工具 jscodeshift 批量重写 Promise 链
该方法适用于大型代码库中存在大量 .then().catch() 模式需统一升级的场景，通过 AST 分析精准定位并安全替换，避免正则误匹配。
1、安装 jscodeshift：npm install --global jscodeshift
2、下载社区维护的 transform 脚本，例如 transform-then-to-async-await.js
3、执行命令：jscodeshift -t transform-then-to-async-await.js src/ --dry --print 预览变更
4、确认无误后移除 --dry 参数执行真实重写，所有匹配的 .then() 链将被替换为 await + try/catch 结构
五、利用 VS Code 扩展 JavaScript Booster 提供交互式重构
该方法面向开发者日常编辑流程，在光标位于 Promise 链内部时，通过快捷键触发智能转换，保留原有变量名与注释，支持预览差异。
1、在 VS Code 扩展市场中搜索并安装 JavaScript Booster
2、打开含 .then() 的 JS 文件，将光标置于任意 .then() 调用起始位置
3、按下 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（macOS），输入 Booster: Convert then to async/await
4、选择目标作用域（当前行、当前函数或整个文件），扩展将生成对比面板供确认后应用
