useeffect 是 react 中用于处理副作用的 hook,可替代类组件的 componentdidmount、componentdidupdate 和 componentwillunmount,支持依赖数组控制执行时机。

直接跳转到函数定义比 Ctrl+F 快得多
查 JS 代码时,最常见需求不是“找某个字符串”,而是“这个 handleClick 函数在哪定义的”“useEffect 是从哪 import 进来的”。VSCode 原生支持 F12 跳转定义,但实际效果依赖语言服务是否就绪。JS 项目里,如果没装 JavaScript and TypeScript Nightly 插件,F12 经常失效或跳到压缩后的 bundle 文件里。
- 确保已安装
JavaScript and TypeScript Nightly(比内置 JS 支持更准,尤其对现代语法如可选链、顶层 await) - 鼠标悬停在函数/变量上,等几秒会出现类型提示和“定义于…”链接,点它比快捷键更稳
- 右键 → “Go to Definition” 比
F12更可靠,尤其遇到同名变量时能弹出选择列表 - 如果跳转失败,先检查当前文件是否被识别为 JavaScript(右下角状态栏应显示“JavaScript”,不是“Plain Text”)
用 Bookmarks 插件标记关键位置,别靠滚动和记忆
大型 JS 文件(比如一个 800 行的 React 组件)里,你不可能每次打开都从头扫到 useMemo 那块逻辑。Bookmarks 插件解决的就是“我刚看过的那几行,下次怎么一秒回去”这个问题。
DMap GL地图JSAPI(dmapgl)开发指南。用于编写、审查、调试 DMap 地图 API 代码,涵盖地图初始化、覆盖物渲染、图层管理、事件处理、控件交互等任务。当用户提及 dmap、dmapgl、jsapi‑gl 或相关地图开发需求时自动触发。
- 在关键位置按
Ctrl+Alt+K(Win)或Cmd+Alt+K(Mac)添加书签,图标会出现在行号旁 - 用
Ctrl+Alt+J/Ctrl+Alt+L在书签间快速跳转,不用保存文件也能跨会话保留 - 不同颜色书签区分用途:红色标待修复的
TODO,绿色标核心逻辑入口,蓝色标第三方库调用点 - 注意:书签只存于当前工作区,换项目要重新打;如果没看到图标,确认插件已启用且编辑器未处于只读模式
全局搜索要过滤文件类型,否则被 node_modules 淹没
想查 axios.create 在哪调用过?直接 Ctrl+Shift+F 搜 create,结果 90% 是 node_modules 里的匹配项,根本没法看。
- 搜索框下方勾选 “files to include”,输入
**/*.js,**/*.ts(排除node_modules和dist默认已生效) - 搜函数名时加括号限定:搜
getData(比搜getData更准,避免匹配到变量名或注释 - 搜配置项或导出名,用正则:
export\s+const\s+API_BASE_URL可精准定位导出语句 - 如果项目用 ESM,搜
from '.*?'能快速列出所有模块导入路径
Quokka.js 实时验证片段逻辑,别切到浏览器控制台
查代码不只是“看”,有时得“试”。比如一段 Array.prototype.reduce 写得对不对?传统做法是复制到浏览器控制台运行,但变量上下文丢了,还得手动构造数据。
- 装好
Quokka.js后,在 JS 文件任意位置写个代码块,光标放进去按Ctrl+K J(Win)或Cmd+K J(Mac),立刻看到执行结果 - 支持
console.log、debugger、甚至await,不用启动服务就能跑异步逻辑 - 对临时测试特别有用:比如验证某个正则是否匹配预期字符串,或者检查
Object.keys(obj).length === 0是否真能判空对象 - 注意:Quokka 默认不加载项目
node_modules,要用第三方库得显式import;另外它只运行当前文件片段,跨文件引用需手动补全










