本篇文章帶大家聊聊vscode中的光標(biāo)操作,本文只會涉及到與我們最息息相關(guān)的光標(biāo)操作,那我們就開始吧!
php入門到就業(yè)線上直播課:進(jìn)入學(xué)習(xí)
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API調(diào)試工具:點擊使用
我們的目標(biāo)只有一個,讓我們喊出我們的口號:讓開發(fā)如絲般順滑!文章中的示例大多 mac 版為主,因為本人是 mac,但 win 版無需擔(dān)心,破陣心法,牢記于心:command 就是 ctrl 鍵。
vscode 小技巧 — 光標(biāo)操作
光標(biāo)操作我們?nèi)粘J褂梅较蜴I,我們在日常中其實肌肉記憶下意識也會用到很多它的技巧,比如按住 cmd 鍵左右就可以到行首行尾,但卻很難總結(jié),一葉遮目的感覺。我拋磚引玉給個突破點:顆粒度。我們?nèi)粘J褂脮r左右方向鍵只會一個字符,即顆粒度是字符,如果我們想到詞尾或者句尾,這就很麻煩了;這句話其實就標(biāo)明了我們的重點:顆粒度;那么,如何操作光標(biāo)的顆粒度呢?
【推薦學(xué)習(xí):《vscode入門教程》】
水平方向上
結(jié)合方向鍵
顆粒度 | mac | win |
---|---|---|
單詞 | option | ctrl |
行 | cmd | 只用 home/end 即可 |
代碼塊 | cmd + shift + | Ctrl + shift + |
垂直方向上
顆粒度 | mac | win |
---|---|---|
文首/文尾 | Cmd+上下方向鍵 | Ctrl + Home/End 鍵 |
當(dāng)前行代碼上/下移 | Option + 上下方向鍵 |
注:【當(dāng)前行上/下移】不是光標(biāo)而是代碼塊操作(因為光標(biāo)操作直接方向鍵就可以了),但很適合放在這里,這樣就可以和水平方向上匹配了;水平上:行-cmd 單詞-option;垂直上文檔-cmd 行-option;
其他光標(biāo)操作
含義 | mac | win |
---|---|---|
撤銷光標(biāo)處理 | Cmd + U | Ctrl + U |
擴(kuò)展:【選中】操作只需要再加個【shift】即可;【刪除】操作顆粒度同光標(biāo)操作,反方向則加fn
即可(如刪除所在行光標(biāo)前所有內(nèi)容為【cmd
+delete
】而光標(biāo)后內(nèi)容則為【cmd
+fn
+delete
】)
光標(biāo)操作實例
針對單詞的光標(biāo)移動
想把光標(biāo)直接移動到整個單詞,也就是 function 的前面或后面,你只需按下 Option(Windows 上是 Ctrl 鍵)和左方向鍵。
光標(biāo)移動到行首或者行末
按住 Cmd + 左方向鍵(Windows 上是 Home 鍵),就可以把光標(biāo)移動到了這行的第一列
移動到文檔的第一行或者最后一行
按下 Cmd 和上下方向鍵即可(Windows 上是 Ctrl + Home/End 鍵)
代碼塊的移動
Cmd + Shift + (Windows 上是 Ctrl + Shift + ),就可以在這對花括號之間跳轉(zhuǎn)。
當(dāng)前行上/下移
其他光標(biāo)操作
撤銷光標(biāo)處理
多光標(biāo)操作
至此,我們已經(jīng)了解了單光標(biāo)的移動,選中(其實就是移動加上shift
鍵),刪除(選中加delete
)等操作,那么,如果我們需要一次操作多個地方呢?這時我們就需要來到光標(biāo)操作的高階使用了,多光標(biāo)操作。
關(guān)于這個話題,其實重點就是如何在需要的位置創(chuàng)建多光標(biāo),因為創(chuàng)建后就和單光標(biāo)的操作一致了。
基礎(chǔ)操作-鼠標(biāo)創(chuàng)建多光標(biāo)
在鍵盤上按住 “Option”(Windows 上是 Alt),然后點擊要新建光標(biāo)的地方即可。
但很明顯,這種方法普遍適用但不方便,我們每創(chuàng)建一個光標(biāo)都需要找到位置并點一下,八二原則,我們可以用快捷鍵實現(xiàn)常見的那 20%的操作,下文主要介紹三種常見場景。
提效操作
處理場景 | 快捷鍵 | 詳解 |
---|---|---|
相同元素 | Cmd + D | 選中元素,然后按下快捷鍵,vscode 就會選中下一個相同的元素并創(chuàng)建光標(biāo);再按再創(chuàng)建,依次類推。 |
上下行處理 | Cmd + Option + 下方向鍵 | 在當(dāng)前光標(biāo)的下面創(chuàng)建一個光標(biāo)。 |
選中多行處理 | Option + Shift + i | 選中多行內(nèi)容,然后按下快捷鍵,vscode 在每一行行尾創(chuàng)建一個光標(biāo) |
關(guān)于光標(biāo)操作的擴(kuò)展
其他光標(biāo)操作
含義 | mac | win |
---|---|---|
撤銷光標(biāo)處理 | Cmd + U | Ctrl + U |
選中刪除聯(lián)想
【選中】操作只需要再加個【shift】即可;【刪除】操作顆粒度同光標(biāo)操作,反方向則加fn
即可(如刪除所在行光標(biāo)前所有內(nèi)容為【cmd
+delete
】而光標(biāo)后內(nèi)容則為【cmd
+fn
+delete
】)
到此,我們就了解了 vscode 本身對光標(biāo)操作的基本設(shè)計理念啦。
自定義快捷鍵
但如果我們用不慣呢?vscode 自然也不會這么死板,它是支持為行為、也就是我們所說的命令自定義快捷鍵的,這里說之前困惑過我的一點,就是我們說的創(chuàng)建光標(biāo)、移動等等對應(yīng) vscode 而言其實就是一條內(nèi)嵌的命令,理解了這個,才好進(jìn)行自定義,我當(dāng)初沒理解所以一直在想的問題是:我該怎么去翻譯我要做的事情。
三步走:找到定義keyboard Shorycut
的地方,找到對應(yīng)的操作,為操作綁定快捷鍵。
Eg:為【選擇括號內(nèi)所有內(nèi)容】的操作綁定Cmd + Shift + ]
快捷鍵為例
找到定義keyboard Shorycut的地方
找到對應(yīng)的操作
為操作綁定快捷鍵
雙擊-》按下需要綁定的快捷鍵-》回車確定(按錯的話別回車就可以了)
這里多說一句,快捷鍵其本質(zhì)就是行為和特定按鍵【在特定場景下】的綁定,在 vscode 中通過 JSON 進(jìn)行描述,我們可以通過執(zhí)行>Open Keyboard Shortcuts(JSON)
進(jìn)行查看,如果我們需要實現(xiàn)一個高級的快捷鍵,就會需要這些知識了。
屬性 | 含義 | 備注 |
---|---|---|
Command | 命令值 | |
When | 在什么情況下這個快捷鍵綁定能夠生效 | |
Key | 快捷鍵 |
其中的when
的定義注意點比較多,所有取值可以查看文檔
而對于高級寫法,VS Code 還支持幾個基礎(chǔ)的操作符。這樣我們就能夠書寫相對復(fù)雜的條件語句了。
!
取反。比如我們希望當(dāng)光標(biāo)不在編輯器里時,綁定一個快捷鍵,那么我們可以使用 !editorFocus,使用 !進(jìn)行取反。==
等于。when 條件值除了是 boolean 以外,也可以是字符串。比如resourceExtname
對應(yīng)的是打開的文件的后綴名,如果我們想給 js 文件綁定一個快捷鍵,我們可以用resourceExtname == .js
。&&
And 操作符。我們可以將多個條件值組合使用,比如我希望當(dāng)光標(biāo)在編輯器里且編輯器里正在編輯的是 js 文件,那么我可以用editorFocus && resourceExtname == .js
。=~
正則表達(dá)式。還是使用上面的例子,如果我要檢測文件后綴是不是 js,我也可以寫成resourceExtname =~ /js/
,通過正則表達(dá)式來進(jìn)行判斷。
總結(jié)
到此,光標(biāo)操作相關(guān)的分享就結(jié)束啦,關(guān)于 vscode 的了解,它并非銀彈,沒它也能用,但總覺得編程本身枯燥的事情,還是需要這種探尋的快樂的,生而有崖而學(xué)無涯,用我那時候?qū)W完寫的隨筆感想為我們這部分分享結(jié)個尾好了:人生性懶惰,不只是表面,更是思想,懶于思考只是習(xí)慣于遇坑填坑,跳進(jìn)坑里幾乎是一件必然事件,勤于思考,享受思考。
最后,順口溜總結(jié)一下下,希望對諸君有所幫助:移動考慮顆粒度,多個就上快捷鍵,定制還需自綁定,操作牢記 shift 鍵。