VS Code (visual studio code) VSC 編輯器（微軟出品，js開發的編輯器）

一.選擇合適的編輯器，提升編程效率

代碼編輯器的選擇，能夠說是開發者社區中一個經久不衰的話題，現今編輯器的數量數不勝數，vim，sublime Text,Emacs,Atom等等，那麼對於一個開發者而言，挑選一個合適的編輯器是能夠有效的提升編程效率；

選擇編輯器時，須要考慮的三個因素：

1.選擇的編輯器對文本，代碼的編程效率要求有多高；

2.選擇的編輯器對編程語音的支持如何，配置是否繁瑣；

3.選擇的編輯器插件生態如何，社區是否活躍；

VSCode：是一款免費的、開源的、高性能的、跨平臺的、輕量級的代碼編輯器，同時，在性能，語言支持、開源社區方面也作的很不錯！

二.學編輯器，到底應該學什麼

編輯器的學習就像編程語言的學習相似，一開始不熟悉的一門編程語言的時候，可能會從官方文檔，從頭至尾的學習這門語言的內容，可是學習過程當中一些小小的語法就可能會影響你學習的進度，到以後你徹底掌握這門語法的時候，你會發現開始學習時遇到的那點語法問題並非那麼的重要。

在掌握一門編程語言的時候，你想要學習另一門編程語言，而且仍是按照第一次的學習方式去學習這門語言，那麼說明你並無從全局理解這門語言，也沒有再腦海中創建「學習框架」。

其實，一門新的編程語言每每是解決老語言的某個短板，可是他們的本質其實並無多大的改變，若是你在學習第一門語言的時候能創建一套本身的「學習框架」，以後再學習一門新的語言的時候就會更有效率。

同時，學習編輯器的學習，也和編輯語言同樣。當使用一個工具時，你最關心的應該是它能用來作什麼，它擅長作什麼，以及它不能作什麼；換句話說，就是指這個工具的‘上限’和‘下限’

首先，咱們先找一下編輯器的‘下限’：

1.快捷鍵的選用：

首先要考慮編輯器再選用快捷鍵的時候是否會與系統自帶快捷鍵有所衝突；
其次，要參考其餘開發工具對快捷鍵組合，迎合用戶習慣；
最後，也是最重要的一點，咱們要看快捷鍵的配置是否有統一性；
配置的統一性：Shift鍵只能用於控制文本選擇，Ctrl或者Cmd鍵只能當作輔助鍵，Tab用於控件之間的跳轉等。

2.編程語言以及框架的支持：

選擇一個編輯器時，咱們須要考慮的是它對你必須使用的編程語言的支持狀況如何，語法高亮是否正確，是否能自動補全代碼可否直接調試或運行測試等；

3.對工做流的選擇和支持（工做流：是對工做流程及其各操做步驟之間業務規則的抽象、歸納描述。）

最後一個影響因素，就是編輯器對工做流的選擇和支持，好比說Vim編輯器（http://www.runoob.com/linux/linux-vim.html）並不自帶資源管理器，若是你但願再Vim中看到文件樹並快速切換文件就須要安裝相應的插件；可是如今大多數的編輯器都直接集成了資源管理器，VSCode自帶了版本管理，能夠說是對版本管理再開發過程當中的重要地位的一種認同，可是有些開發工具吧測試功能集成進去，這個需求並非因此人都認爲是平常開發必要的；

接着，咱們來講說編輯器的‘上限’：

若是說一款編輯器支持用戶寫插件來定製功能，那麼它的‘上限’就很高了。像Eclipse這樣容許修改任意功能的工具來講，它們的‘上限’理論就是無限的，可是擴展編輯器這個事，仍是須要從社區和我的的，可否達到這個高度仍是個未知數。

Eclipse是最流行的java編輯器之一，插件的開發語言也是java，因此它的插件社區仍是很活躍的，可是Eclipse把插件運行到主程序中，一旦插件的性能堪憂，就會影響到Eclipse的自己體驗。

VSCode的插件開發語言是JavaScript，因此寫擴展對於不少人來講是沒有門檻的，由於大多數人多少都會寫點js，因此對於VSCode來講插件社區的活躍度仍是不用擔憂的，主要是要考慮如何避免跳進Eclipse的坑裏。

關於編輯器的‘上限’和‘下限’，其實就是咱們再選擇編輯器的時候所須要考慮的因素以及學習的方向，固然最重要的就是多動手；

三.關於VSCode

VSCode(Visual Studio Code):它是一個免費的，開源的跨平臺編輯器。之因此強調‘編輯器’，多是VSCode並沒有意成爲一個全尺寸的集成開發環境，也就是IDE。
它是由Erich Gamma把Monaco Editor移植到桌面平臺上，成爲了現今的VSCode。

不少人都把編輯器等同於IDE，其實並不是如此。IDE更爲注重編程體驗，對代碼有很好的理解，同時側重於爲代碼調試、測試等提供圖形化界面的支持。所以，可能會顯得比較笨重；

而編輯器則相對更輕量，側重文件或者文件夾，語言，工做流的支持更豐富和自由，VSCode的定位就是編輯器，但又並不侷限於此。

開源開發的平臺：

首先，VSCode的源代碼以MIT協議（開源中國）開源，這就意味着咱們能夠免費獲取VSCode的核心代碼，社區能夠基於VSCode的代碼，開發本身的產品；而VSCode也常常能從一些知名的項目中吸收寶貴的經驗。

其次，VSCode的源代碼託管在GitHub上，同時使用GitHub的開發計劃和測試，使每一個用戶均可以在GitHub上了解VSCode的開發進度，做爲用戶，能夠更好的瞭解產品的發展狀況。

再者，VSCode自帶了TypeScript和Node.js的支持，用戶下載VSCode後能當即得到javascript和nodejs的智能提示，且無需任何配置便可調試nodejs，然而VSCode的團隊並不會精通全部的語言，那麼對於他們不熟悉的語言，VSCode該怎麼支持呢？最好的方法就是讓專業的人來作，因此VSCode爲編程工做者提供了統一的API（即Language Server Protocol和 Code Debugging Protocol），使得每個語言都能獲得更好的支持。

VSCode學習指南

1.VSCode有一套本身的快捷鍵，你能夠經過學習快捷鍵來了解核心編輯器所支持的功能。同時，VSCode容許自定義快捷鍵，使用戶能更好的使用VSCode。VSCode對鼠標，多光標，搜索都有完備的支持，對自動補全，代碼片斷等都包羅萬象。

2.學會使用工做臺，工做區，VSCode中除了編輯器區域，還有其餘不少功能，像是資源管理器。跨文件搜索、插件管理等，它們就組成了統一的界面，就是工做臺；這個工做臺的設計表明了VSCode對工做流的選擇。VSCode內置的軟件版本管理，終端模擬器，調試器等，都能提升工做效率。

3.VSCode容許定製和開發插件，因此試着把本身的想法，來知足本身的需求，能更好的提高本身，瞭解VSCode；

4.關注每個月的發佈更新日誌，關注VSCode官方博客；

經過以上幾個步驟，能更好的使用好VSCode，提升工做效率。

總結：VSCode的定位是輕量級的代碼編輯器，綜合了Eclipse等許多優秀工具的優點，同時也解決了它們的弊端，VSCode在性能、語言支持、社區方面都很不錯；

VSCode更新日誌：https://code.visualstudio.com/updates/v1_27

VSCode官方博客：https://code.visualstudio.com/blogs/2018/09/12/engineering-with-azure-pipelines

VSCode社區：https://code.visualstudio.com/community

四.快速上手VSCode

安裝與版本選擇

VSCode有兩個發佈渠道，一個是經常使用的穩定版，每個月發佈一個主版本；另外一個是insiders，每週一到週五早上6點發布，也是VSCode內部團隊使用的版本，目的是爲了更好的發現Bug。微軟內部對這個作法還有個專門的名詞：eat your own dog food(吃本身的狗糧)。

VSCode目前在全世界大概有一萬五千名用戶在使用insiders版本。不過剛接觸VSCode，穩定版會相對適合。可是若是已經使用VSCode一段時間的話，能夠試一試insiders。由於使用這個版本能夠儘早用上最新的功能，通常VSCode的新功能會先在insiders上線，等運行一段時間後纔會隨着當月穩定版發佈。改動較大的可能會運行兩個月以後纔會推向穩定版。

其次，一個新功能的添加每每是不成熟的，使用insiders能夠第一時間再GitHub上反饋對新功能的見解及建議，甚至能爲其提供代碼。

下載安裝VSCode：

官網：https://code.visualstudio.com

初次使用VSCode

VSCode第一次啓動的時候會顯示一個‘歡迎使用’頁，主要是爲了方便快速打開文件，文件夾以及訪問歷史文件，更換主題色，更換快捷鍵等：

 

初次使用界面

這個界面有着不少你可能感興趣的功能：

1.命令面板：

咱們能夠經過快捷鍵F1或者Ctrl+Shift+P（mac上的Cmd+Shift+P）鍵打開VSCode的命令面板。!

 

命令面板

VSCode的絕大部分命令都能從命令面板找到，因此只要熟悉命令面板，就能不用鼠標，徹底使用鍵盤來完成編碼工做。

2.界面概覽：

展現VSCode默認界面裏的不一樣部件的位置，名稱和快捷鍵。VSCode強調無鼠標操做，可是記快捷鍵就會成爲不少新手的痛點，這個界面剛好能解決這個痛點。

 

界面概覽

3.交互式演戲場：

打開這個界面，咱們會看到不少的英文教程，它經過各類交互實例，展現了一些高級編輯代碼功能的使用，每一個功能都會有一個代碼片斷和編輯器能供咱們使用。

 

交互式演戲場

五.VSCode快捷鍵

光標移動

1.option + ← ：移動到單詞最前面；

2.option + → ：移動到單詞最末尾；

3.option + 方向鍵 ：以單詞爲單位移動；

4.cmd + ← ：移動到當前行最前面；

5.cmd + → ：移動到當前行最末尾；

6.cmd + shift + \ ：花括號之間跳轉；

7.cmd + 上下鍵 ：移動到文檔第一行或最後一行；

文本選擇

基於單詞，行，文檔的光標操做加上個shift鍵，就能夠移動光標的同時選擇文本；

刪除操做

刪除當前選中文本內容（Windows：home+shift；macOS：cmd+left+shift）

1.cmd + Backspace ：刪除當前行光標後的全部字符；

2.cmd + delete ：刪除光標前的全部字符；

3.option + delete ：把當前單詞光標前的字符刪除；

4.option + Backspace ：刪除當前單詞光標後的字符；

自定義快捷鍵

打開命令面板（F1或ctrl+shift+p）搜索‘打開鍵盤快捷方式’，就能夠更換或者刪除快捷鍵；

 

自定義快捷鍵

六.VSCode快捷鍵進階

1.cmd + shfit + k :刪除當前代碼行；

2.cmd + x ：剪切這行代碼；

3.cmd + Enter :在當前行的上面新增一行；

4.option + ‘上下鍵’：將當前行或者當前選中的幾行代碼再編輯器中上下移動；

5.option + shift +‘上下方向鍵’：向上向下複製當前行；

移動代碼行，代碼縮進發生改變

添加註釋

1.cmd + / ：註釋一行代碼；

2.option + shift + A :註釋一整段代碼；

格式化代碼

1.option + shift + F :格式化代碼；

2.cmd + K cmd + F :格式化選中行代碼；

3.cmd + shift + P ：代碼縮進；

七.文件、符號、代碼之間的快速跳轉

1.Ctrl + Tab(同時按住),繼續按着Ctrl鍵，鬆開Tab鍵 :打開當前打開文件的列表，選擇要打開文件，鬆開Ctrl就能打開對應文件；

2.Ctrl + P :打開最近打開文件列表，同時列表頂部出現搜索框，搜索文件名，回車（Enter），能夠再當前窗口打開對應文件；使用Cmd + Enter會在新的編輯器窗口打開這個文件。

3.Ctrl + g :行跳轉，輸入對應數字回車，能夠跳轉到當前文件的當前行。

4.Ctrl + p(輸入文件名 + 「：」 + 行數)：跳轉到指定文件的指定行數。

5.Cmd + shift + O :調出當前文件的符號（函數名等），使用方向鍵或者搜索，回車，就能跳轉到你想要的符號；若是輸入「：」能夠對當前文件的全部符號進行分類；

6.Ctrl + T ：打開多個文件，搜索多個文件中的符號；

7.F12：跳轉到函數的定義處；Cmd + F12 ：跳轉到函數的實現位置；注：js中沒有接口的概念，定義和實現是相同的，因此js中的F12和Cmd + F12效果是同樣的；

8.Shift + F12 ：打開函數引用的預覽（把光標放在函數或者類上，按Shift+F12能夠打開一個引用列表和內嵌編輯器）

八.VSCode中的鼠標操做

1.在VSCode中，單擊鼠標左鍵：把光標移動到響應的位置；雙擊鼠標左鍵：將當前光標下的單詞選中；三擊鼠標左鍵：選中當前行代碼；四次點擊鼠標左鍵：選中整個文檔。

2.鼠標左鍵單擊行號：直接選中所在行；按住鼠標左鍵再行號上下移動：能夠選中多行代碼；

3.拖動選中的代碼，按住鼠標左鍵，移動鼠標能夠改變代碼位置；若是想在拖動時複製一份代碼，能夠按住Ctrl鍵，操做結果就能從原來的「剪切+複製」變成「複製+黏貼」。

4.VSCode中，若是鼠標擁有中鍵，只須要按下鼠標中鍵，而後對着一段文檔拖出一個框，再框中的代碼就被選中了，並且每一行選中的代碼，都有一個獨立的光標。

5.懸停提示窗口：當鼠標移動到某些文件上以後，一會就會顯示跟鼠標下文本相關的信息；若是鼠標放在某個函數上，按下Ctrl時，則能再懸停提示的窗口上看到該函數的實現。

6.代碼的跳轉和連接：若是咱們把鼠標放在函數上時，函數下方會出現一個下劃線，而後當咱們按下鼠標左鍵時，就能跳轉到該函數的定義處。當咱們再編寫Markdown這樣的非編程語言的文檔時，經過Ctrl+鼠標左鍵能打開超級連接。