大纲（Outline）视图：让你对代码结构一目了然

大纲视图是代码编辑器中用于提取并层级化展示文件关键结构（如类、函数、方法、导出成员等）的导航功能，支持快速跳转、重命名及结构问题识别，主流编辑器通过快捷键或侧边栏启用。

大纲视图是代码编辑器里一个非常实用的功能，它把当前文件的函数、类、方法、变量等关键结构提取出来，以层级化列表形式展示，帮你快速掌握整体脉络，不用靠滚动和搜索硬找。

哪些元素会出现在大纲里

不同语言支持的结构略有差异，但通常包括：

• 类（class）和结构体（Struct）
• 函数（function）、方法（method）和箭头函数（arrow function）
• 导出（export）或公共（public）成员（尤其在 typescript 中）
• 部分编辑器还支持识别注释区块（如 // #region）或配置项定义

怎么打开和使用它

主流编辑器操作都很简单：

• VS Code：按 Ctrl+Shift+O（windows/linux）或 Cmd+Shift+O（macOS），或点击侧边栏“大纲”图标
• JetBrains 系列（如 webstorm）：默认右侧有“Structure”工具窗口，快捷键是 Ctrl+F12
• sublime Text：安装插件 Package Control → “Outline” 后，用 Ctrl+R 呼出

点列表中的任意一项，编辑器会立刻跳转到对应位置，双击还能重命名（如果语言支持重构）。

Veo

Google 最新发布的 ai 视频生成模型

567

查看详情

它不只是导航工具

大纲视图还能帮你发现结构问题：

• 函数太多、嵌套太深？列表一眼看出臃肿程度
• 缺少类名或函数名？空白项可能提示语法错误或未命名表达式
• 导出混乱？TypeScript 或 ES 模块中，大纲能直观反映模块对外暴露了什么

基本上就这些。用熟了，写长文件、读别人代码、做重构时都会快很多。