VSCode 代码的行编辑

🌙
手机阅读
本文目录结构

VSCode 代码行编辑

下面我就以一段 CSS 代码作为例子,来和你分享下代码行编辑中的高阶技巧。

.foo {
  padding: 5px;
  margin: 5px;
  font-size: 5px;
}

删除一行或多行

要删掉一行代码,你可以选中它,然后再按 Delete 键。

不过还有一个快捷键,那就是直接按下 Cmd + Shift + K (Windows 上是 “Ctrl + Shift + K”),当前代码行就可以被删除了。

VSCode 代码行编辑

剪切某行代码

如果你想要剪切某行代码,那么你直接按下 Cmd + x (Windows 上是 “Ctrl + x”) 即可。

VSCode 代码行编辑

新起一行插入

我想你肯定很清楚,“Enter” 键的基础作用是能在编辑器里光标所在的位置添加一个换行符。

但是很多时候你可能并不是单纯地要将一行分成两段,而是希望在这行的下面或者上面开始一段新的代码。

这个功能对应的快捷键非常好记,它跟 “Enter”键十分接近。

当前行的下面新起一行

当你想在当前行的下面新起一行时,你只需按下 Cmd + Enter (Windows 上是 “Ctrl + Enter”);

当前行的上面新开始一行

而当你想在当前行的上面新起一行时,你只要按下 Cmd + Shift + Enter (Windows 上是 “Ctrl + Shift + Enter”)就行了。

VSCode 代码行编辑

移动代码

当你想移动一段代码时,一般你可能会分三步走:先选中,再剪切,最后粘贴。

不过我更喜欢的是按住 Option + 上下方向键(Windows 中就是“Alt + 上下方向键”) ,将当前行,或者当前选中的几行代码,在编辑器里上下移动。

VSCode 代码行编辑

复制移动代码

如果你同时按住 “Shift” 键的话,也就是 “Option + Shift + 上下方向键”(Windows 中就是“Alt + shift + 上下方向键”),那就可以复制这几行,然后粘贴到当前行的上面或者下面

移动的时候,带复制的效果

VSCode 代码行编辑

移动自带格式化效果

另外,你在尝试“Option + 上下方向键”这个快捷键“上下移动”时,可能也发现了,当你把一段代码移动到花括号里面或者外面时,代码前的制表符或者空格的数量会自动发生改变,这样你就不需要移动完代码后再调整了。

VSCode 代码行编辑

AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

于2021年离开前端领域,目前重心放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>

于2021年离开前端领域,目前从事区块链方面工作了