熟記這些VSCode快捷方式,提高你的開發效率!

2022-02-21 22:00:07
本篇文章給大家總結一些官方檔案中記錄的可提高效率的快捷方式,熟記它們,讓開發效率「蹭蹭」提升!!

Visual Studio Code 是目前最流行、最常用的程式碼編輯器之一,它是開源的並且可以免費使用。它還提供對多種語言和框架的支援。【推薦學習:《》】

注意,這些 Visual Studio Code 快捷方式取自於 VS Code 官方檔案。如果某些快捷方式不起作用,可能是由於編輯器或檔案格式中的快捷方式發生了變化,或者安裝的擴充套件影響了該快捷方式。

一、快捷導航

1. 搜尋檔案

當需要搜尋特定的檔案,當專案很大時,就會耗費大量時間。即使已經知道檔案在哪,使用這個快捷鍵也會很方便,可以輕鬆開啟專案中的檔案。

  • Windows/Linux: ctrl + P
  • macOS: command + P

2. 開啟設定

Visual Studio Code 有許多功能和設定,可以根據需要進行更改。此快捷鍵可以在必要時輕鬆地開啟設定。

  • Windows/Linux: ctrl + ,
  • macOS: command + ,

3. 切換側邊欄

很多時候,我們需要更多空間來放置需要處理的檔案。因此,此快捷鍵可以方便地在顯示或隱藏側邊欄。

  • Windows/Linux: ctrl + B
  • macOS: command + B

4. 導航索引標籤

當開啟了許多索引標籤並且需要在它們之間進行切換時,就可以使用這個快捷鍵,它會顯示索引標籤列表並在它們之間導航,我們可以選擇要開啟的索引標籤。

  • Windows/Linux: ctrl + shift + tab
  • macOS: control + shift + tab

5. 導航索引標籤組

Visual Studio Code 提供了建立索引標籤組功能。索引標籤組允許我們將索引標籤分組,每個索引標籤組會佔螢幕的一部分。使用該快捷鍵可以在不同的索引標籤組進行切換。如果在快捷方式中選擇的索引標籤組大於當前開啟的組數,此快捷鍵就會建立一個新組。

  • Windows/Linux : ctrl + 1或2或3
  • macOS:command + 1或2或3

6. 開啟終端

在開發過程中,會經常使用終端。Visual Studio Code 允許我們在編輯器內開啟終端視窗。這樣就無需在編輯器和終端之間切換了,讓我們可以專注於編輯器和程式碼。

  • Windows/Linux: ctrl + J
  • macOS: command + J

1.gif

7. 開啟命令面板

我們可以在 Visual Studio Code 中執行許多命令。使用這個快捷鍵可以輕鬆開啟命令面板。命令面板允許搜尋可以使用的命令並執行它們。

  • Windows/Linux: ctrl + shift + P
  • macOS: command + shift + P

2.gif

二、快捷選擇

在開發過程中,經常需要在程式碼中進行選擇,包括複製、剪下等操作。與其使用滑鼠進行操作,不如使用鍵盤進行操作可以節省時間。這些快捷鍵專注於快速做出選擇。

1. 選擇當前行

可以使用這個快捷鍵來快速選擇遊標所在行的整行程式碼。

  • Windows/Linux: ctrl + L
  • macOS: command + L

2. 當前選擇

使用此快捷鍵只需選中一次要查詢的文字,就可以在檔案中選中所有這個文字,這樣就可以同時編輯這些文字了。

  • Windows/Linux : ctrl + shift + L
  • macOS : command + shift + L

3. 當前單詞

此快捷鍵會執行與上面快捷鍵相同的操作,但無需選擇任何內容。當遊標放在一個詞上時,按此快捷鍵就可以選擇這個單詞在當前檔案中的所有的位置。

  • Windows/Linux: ctrl + F2
  • macOS: command + F2 + fn

3.gif

4. 選擇直到單詞的結尾

選擇程式碼的某部分時,可以移動和擴充套件此快捷方式的選擇。可以使用右箭頭或左箭頭朝想要的方向前進。

  • Windows/Linux : shift + alt + →或←
  • macOS : shift + option + →或←

5. 通過拖動滑鼠選擇多行程式碼

將遊標拖過程式碼就會從頭到尾選擇每一行。但是也可以使用此快捷來選擇部分程式碼行,但只能選擇拖動的多行程式碼。

  • Windows/Linux : shift + alt + 拖動遊標
  • macOS : shift + option + 拖動遊標

6. 使用箭頭鍵選擇多行程式碼

使用該快捷鍵也可以執行上述操作,但無需使用滑鼠,而是使用鍵盤上的箭頭鍵。

  • Windows/Linux : ctrl + shift + alt + → 或 ← 或 ↓或↑
  • macOS : command + shift + option + → 或 ← 或 ↓或↑

4.gif

三、快捷查詢

所有編輯器都具有查詢功能,以便可以在當前檔案或多個檔案中查詢某些單詞,例如函數或變數名稱、短語或程式碼塊等。下面就來看看查詢功能相關的快捷鍵。

1. 結果導航

可以使用此快捷鍵在檔案中的查詢結果之間進行移動。

  • Windows/Linux:F3
  • macOS:F3 + fn

2. 選擇多個結果

如果想要修改多個搜尋結果,就可以使用此快捷鍵在檔案中選擇查詢結果中的多個內容,每次按下此鍵後都會選擇一個結果,然後就會按搜尋結果的順序進行選中。

  • Windows/Linux : ctrl + D
  • macOS : command + D

3. 選擇所有結果

如果想使用查詢功能對所有查詢結果進行修改,則此快捷鍵就可以選擇所有查詢結果。

  • Windows/Linux: alt + enter
  • macOS: option + enter

四、程式碼導航

隨著檔案或專案變得複雜,找到程式碼的某些部分就變得越來越困難。手動查詢錯誤或轉到某一行程式碼可能比較困難。下面這些快捷鍵就可以省去很多麻煩,讓我們將更多時間投入到真正想做的事情上。

1. 跳轉指定行

當遇到指定一行程式碼導致編譯或執行時錯誤時,就可以使用該快捷鍵跳轉到這一行程式碼,只需按下這個快捷鍵,輸入程式碼行數,按下回車即可跳轉到這行程式碼。當一個檔案中程式碼特別多時,這個快捷鍵就非常有用。

  • Windows/Linux: ctrl + G
  • macOS: control + G

5.gif

2. 轉到匹配的括號

我們可能會需要查詢匹配程式碼塊的右括號。當檔案很長時,就很困難了。使用此快捷鍵可以輕鬆找到當前塊的右匹配括號。在 HTML 標籤中,它可以移動到當前標籤的末尾。

  • Windows/Linux : ctrl + shift + \
  • macOS : command + shift + \

3. 摺疊/展開程式碼塊

在包含大量程式碼的檔案時,我們可以摺疊(隱藏)當前不關注的某個程式碼塊,以便可以專注於其他內容。此快捷鍵就是用來摺疊或展開程式碼塊的。單擊程式碼塊中的任意位置,然後按以下鍵即可。

  • Windows/Linux : ctrl + shift + [或]
  • macOS : command + option + [或]

4. 摺疊/展開程式碼塊和子程式碼塊

如果程式碼塊包含子程式碼塊怎麼辦?使用上面的命令將會摺疊父程式碼塊,但當父程式碼塊展開時,子程式碼塊將保持不變。如果需要摺疊和展開一個程式碼塊及其子程式碼塊,可以使用此快捷鍵來完成。

  • Windows/Linux : ctrl + K + [或]
  • macOS : command + K + [或]

4. 導航到錯誤和警告處

在程式碼中查詢出現錯誤和警告的程式碼至關重要。此快捷鍵省去了捲動以找到確切問題的麻煩。它可以直接轉到下一個錯誤或警告處。

  • Windows/Linux:F8
  • macOS:F8 + fn

五、移動遊標

在很多情況下,可能需要有多個遊標,每個遊標位於檔案中的不同位置。這些快捷鍵有助於更輕鬆地使用多個遊標進行移動。

1. 特定位置插入額外遊標

此鍵盤快捷鍵可以在檔案中任何位置插入一個額外的遊標。

  • Windows/Linux : alt + 滑鼠點選位置
  • macOS:option + 滑鼠點選位置

2. 上方或下方插入額外遊標

插入遊標的第二種方法是將其插入在當前遊標位置的上方或下方。

  • Windows/Linux : ctrl + alt +↓或↑
  • macOS : command + option +↓或↑

3. 撤消遊標插入

如果錯誤地插入了遊標,或者不再需要在該位置插入遊標怎麼辦?此快捷鍵可以撤消上次插入的遊標。當插入多個遊標時,這個快鍵鍵將非常有用,因為它可以將其他遊標保持在原位並刪除最後插入的遊標。

  • Windows/Linux : ctrl + U
  • macOS : command + U

4. 在選中程式碼的末尾插入遊標

使用該快捷鍵可以在選中程式碼的每一行的最後插入遊標。

  • Windows/Linux : shift + alt + I
  • macOS : shift + option + I

六、快捷編碼

1. 移動程式碼行或程式碼塊

很多時候需要將一條行或多行程式碼從一個位置移動到另一個位置。此快捷鍵並不是複製或剪下並將程式碼貼上到另一個位置,而是提供了一種更快的解決方案,只需將遊標放在該程式碼行上。如果想移動多行程式碼,只需先選中需要移動的程式碼,再使用該快捷鍵即可。

  • Windows/Linux : alt +↓或↑
  • macOS:option +↓或↑

2. 複製程式碼行或程式碼塊

如果需要複製一行或多行程式碼並將其貼上到下方或上方怎麼辦?這個快捷鍵不必實際複製和貼上這些程式碼,而是根據使用箭頭選擇的方向在其下方或上方複製該行。如果想複製多行程式碼,只需先選中需要複製的程式碼,再使用該快捷鍵即可。

  • Windows/Linux : shift + alt +↓或↑
  • macOS : shift + option +↓或↑

3. 程式碼縮排

當將程式碼從一個位置複製到另一個位置時,或者更改程式碼時,很多時候程式碼會出現錯誤的縮排。這個快捷鍵就可以根據需要縮排程式碼,也可以選擇多行程式碼將它們一起移動。

  • Windows/Linux : ctrl + [或]
  • macOS:command + [或]

4. 切換程式碼註釋

使用該快捷鍵可以註釋或取消註釋遊標所在行程式碼。如果想要註釋或取消註釋多行程式碼,只需要先選中多行程式碼即可。

  • Windows/Linux: ctrl + /
  • macOS: command + /

6.gif

5. 切換程式碼塊註釋

與上面的快捷鍵不同,下面的快捷鍵會將選中的多行程式碼註釋為單個註釋。

  • Windows/Linux : shift + alt + A
  • macOS : shift + option + A

7.gif

6. 程式碼格式

出於可讀性的原因,保持程式碼指定的格式非常重要。Visual Studio Code 提供了兩個用於程式碼格式化的快捷命令。

下面快捷鍵可以格式化整個檔案中的程式碼:

  • Windows/Linux : ctrl + shift + F
  • macOS : option + shift + F

下面快捷鍵可以格式化已選中的程式碼:

  • Windows/Linux : ctrl + K,然後ctr l+ F
  • macOS : command + K,然後command + F

7. 快速修復錯誤

在很多情況下,如果出現一個常見或簡單的錯誤,Visual Studio Code 可以直接修復它——例如缺少分號。如果快速修復可以使用,則此該快捷鍵可以快速修復錯誤或警告。

  • Windows/Linux : ctrl + .
  • macOS : command + .

8. 重新命名

如果手動重新命名多次使用的變數、函數或類就很容易出錯。此快捷鍵提供了一種重新命名任何符號的安全方法。

  • Windows/Linux:F2
  • macOS:F2 + fn

9. 刪除空白

可以使用以下快捷鍵來刪除多餘的空行:

  • Windows/Linux : ctrl + K + X
  • macOS : command + K + X

注意:需要一直按著 ctrl 或 command 鍵,然後先按 K 鍵,再按 X 鍵。

10. 更改程式語言

預設情況下,Visual Studio Code 會檢測正在處理的檔案所用的程式語言。通常,它是通過檢查檔案的擴充套件名來完成的。但是,如果不支援檔案的擴充套件名,就可能無法正確檢測語言。因此,當需要更改檔案的程式語言,可以使用此快捷鍵。

  • Windows/Linux : ctrl + K, 然後按M
  • macOS : command + K,然後按M

七、更好的編碼

1. 轉到定義

很多時候,我們需要了解正在使用的程式碼的定義是怎樣的。比如呼叫一個函數時,想知道這個函數是如何定義的,就可以使用這個快捷鍵。

  • Windows/Linux:F12
  • macOS:F12 + fn

2. 檢視定義

此快捷鍵可以在檢查定義的地方開啟定義。這樣可以更輕鬆地檢視定義,而無需切換到另一個檔案或程式碼行。

  • Windows/Linux : alt + F12
  • macOS : option + F12 + fn

8.gif

3. 切換建議

在編寫程式碼時,VS Code 或者一些擴充套件會展示程式碼建議。此快捷鍵可以快速切換程式碼建議以檢視或隱藏它們。

  • Windows/Linux: ctrl + I
  • macOS : command + I

VS Code 是目前最好用的程式碼編輯器之一。它提供了許多開箱即用的功能以及豐富的第三方擴充套件,在 VS Code 中使用快捷鍵可以使開發更加輕鬆,讓我們可以專注於在更短的時間編寫高品質的程式碼。本文介紹了一些實用的 Visual Studio Code 快捷鍵,希望能幫助你提高開發效率!

最後,附上在 Windows、Linux、macOS 系統中 VS Code 的快捷鍵:

9.gif

10.gif

11.gif

更多關於VSCode的相關知識,請存取:!!

以上就是熟記這些VSCode快捷方式,提高你的開發效率!的詳細內容,更多請關注TW511.COM其它相關文章!