代码片段 - 初学者指南

2025-06-09

代码片段 - 初学者指南

资料来源:Reddit/r/dundermifflin

当我开始参加编程训练营时,老师们首先灌输的概念之一就是程序员应该“努力变得懒惰”。我们应该利用我们掌握的所有工具,让编写应用程序尽可能轻松便捷。如果有一种方法可以避免重复工作,或者可以创建一个捷径,避免编写大量重复的代码,我们就应该抓住它,不要回头。代码片段就是程序员最好的朋友。

那么,什么是代码片段?

“代码片段”是指可重复使用的源代码、机器码或文本的一小部分。它们可以帮助程序员在日常编程过程中避免输入重复的代码。大多数现代文本编辑程序都提供某种形式的代码片段创建和管理功能(之所以说是“大多数”,是因为我并不了解所有现有的编辑器)。虽然不同编辑器管理代码片段的具体方式略有不同,但基本概念是相同的。我将以 Visual Studio Code 为例进行说明。

代码片段由什么组成?

  1. 名称 - 非常直观。代码片段的名称。这不是用于在编辑器中触发代码片段的名称。
  2. 前缀 - 用于在代码编辑器中触发代码片段的实际按键。请选择一个容易记住的前缀。
  3. 主体 - 调用代码片段时将被复制到空间中的实际代码。
  4. 描述——代码片段内容的简单描述。

那么,我为什么还要费心使用代码片段呢?

  1. 它们让我们免于不必要的按键操作(你的手腕会感谢你的)。记住,我们应该尽可能地偷懒。
  2. 它们使函数的特定格式更容易记住。某些函数可能极其复杂,或者包含难以记住的语法。代码片段可帮助您保持代码的一致性,而无需费力查找拼写错误和语法错误。
  3. 它们是可共享的(不要吝惜你的代码片段)。如果你在一个团队中开发一个项目,代码片段可以帮助确保大家都以相同的方式编写某些代码块——从而使你的代码更加一致,更易读。

好吧……我被说服了。如何创建代码片段

基本结构

让我们从一个简单的例子开始:我们需要编写大量唯一的地址来为测试环境的数据库提供数据。(使用 Ruby)
我们的地址脚手架可能看起来像这样: 所以……每次我们想要创建一个新的地址时,我们都必须输入(并填写值!):


噗噗噗——不用了,谢谢。光是想想就觉得手腕酸痛。让我们创建一个简单的代码片段来自动化这个过程。记住,根据你使用的代码编辑器,操作说明可能会略有不同,但基本步骤基本相同:

  1. 打开用户代码片段界面。在 VS Code 中:菜单 -> 代码 -> 首选项 -> 用户代码片段。(或者按 Cmd+Shift+P 并搜索“用户代码片段”)
  2. 选择您想要创建代码片段的语言(在本例中为 Ruby)。
  3. 为代码片段创建基本脚手架:

  4. 太棒了。现在我们要做的就是填写地址的相关信息:

  5. 保存用户代码片段文件,然后address在 ruby​​ 文件中输入 go type(我们在创建代码片段时声明的“前缀”),看看我们的劳动成果! (您可以看到我们创建的描述!)……现在按下,然后BAM!:注意您可能注意到我们删除了代码片段正文中的引号。别担心!我们现在要改进我们的代码片段,将这些引号替换为“光标位置”,我们可以在创建代码片段后通过 Tab 键切换并填写。

    Tab

    添加光标定位和占位符

    现在我们已经有了代码片段的基本结构,我们可以添加一些光标定位功能,以便我们可以Tab通过代码片段添加自定义文本,例如变量、字符串或代码所需的任何内容。

    在 VS Code 中,光标位置是通过在代码片段中插入${1:"placeholder text"}${2:"placeholder text"}{3:"placeholder text"}等来创建的,其中每个括号内的数字表示按下Tab该数字后光标的位置。“占位符文本”是代码片段首次调用时显示的内容(使用这些占位符文本可以提醒您应该在该位置输入什么)。因此,使用我们的例子:注意:我们只需要转义符(“\”),因为我们希望占位符位于引号(“”)内,如果没有它们,我们就是告诉代码片段,当引号结束时,代码片段正文的一行就结束了。 现在,当我们使用 调用代码片段时没错!现在,当我们输入信息并按 Tab 键浏览代码片段时,我们可以直接跳转到下一个要填写的部分。

    address

附加功能

  1. 多行。只需关闭引号,,在末尾添加一个,然后" "在下一行开始一组新的,即可在代码片段中创建多行:将生成: OoooOooOo,看,光标也同时突出显示了多行……:
  2. 同时更改多个光标点。您可以一次更改多个光标点。在上面的示例中,使用 声明了多个光标点${1:...}。当您开始在代码片段中输入信息时,每个光标点都会同时更新。

所以……代码片段的精髓就在于此。它们可以根据您的需求,简单或复杂。我将向您展示我最喜欢的一个代码片段。记住,当您记不住一段代码时,“别手忙脚乱,赶紧学起来!”


不同文本编辑器的资源

  • VS 代码

  • 原子

  • Sublime Text
  • 资料来源:Reddit/r/dundermifflin

    鏂囩珷鏉ユ簮锛�https://dev.to/matthewbrophy/code-snippets---a-beginners-guide-p4d
    PREV
    坚持终有回报:React 组件与本地存储同步
    NEXT
    Rust 和 porque aprenderlo 的 Primeros pasos