使用#region和#endregion注释标记可在VSCode中创建自定义折叠区域，支持JavaScript、Python、Java等多种语言，通过语义化命名和嵌套结构提升代码可读性，结合快捷键如Ctrl+Shift+[折叠、Ctrl+K Ctrl+8折叠全部，能显著提高大型文件的开发效率。
在使用 VSCode 编写代码时，合理利用代码折叠功能可以大幅提升可读性和开发效率。除了默认的函数、类、块级结构折叠外，VSCode 还支持通过自定义标记创建手动折叠区域，让你按逻辑组织代码块。
使用注释标记创建可折叠区域
VSCode 支持通过特定格式的注释来定义可折叠区域，适用于多种语言。只需在代码中插入开始和结束标记，就能将任意代码段包裹成可折叠内容。
常用语法如下：
- 开始标记： // #region 或 /* #region */
- 结束标记： // #endregion 或 /* #endregion */
例如，在 JavaScript 中：
// #region 工具函数function helperA() { }
function helperB() { }
// #endregion
这段代码会在编辑器左侧出现折叠箭头，点击即可收起或展开“工具函数”区域。
支持的语言与注释格式
不同编程语言需使用对应的注释语法，但核心标记一致：
- JavaScript/TypeScript： // #region 和 // #endregion
- Python： # region 和 # endregion
- Java/C#： /* #region */ 和 /* #endregion */
- HTML/SCSS： <!-- #region --> 和 <!-- #endregion -->
注意空格和大小写不敏感，但建议保持统一风格。
嵌套折叠与命名建议
你可以嵌套多个 region 区域，实现层级化管理：
// #region API 配置// #region 认证相关
const token = '...';
// #endregion
// #region 请求地址
const baseUrl = '...';
// #endregion
// #endregion
为 region 添加描述性名称，有助于快速识别内容。比如：
- // #region 表单验证规则
- // #region 页面事件监听
这样在大纲视图或滚动查找时更直观。
快捷键与操作技巧
掌握几个常用快捷键能更快地操作折叠区域：
- 折叠区域： Ctrl + Shift + [（Windows/Linux）或 Cmd + Option + [（Mac）
- 展开区域： Ctrl + Shift + ]（Windows/Linux）或 Cmd + Option + ]（Mac）
- 折叠全部 region： Ctrl + K, 然后 Ctrl + 8
- 展开全部： Ctrl + K, 然后 Ctrl + J
你也可以在编辑器右上角的“大纲”面板中，右键选择“折叠所有区域”。
基本上就这些。合理使用自定义折叠区域，能让复杂文件变得更清晰，尤其是维护大型组件或配置文件时特别实用。记得结合语义化命名，让折叠本身也成为一种文档提示。
