It's worth understanding some vscode cursor operations to make development as smooth as silk!

This article will take you to talk about the cursor operations in vscode. This article will only cover the cursor operations that are most closely related to us, so let’s get started!

We have only one goal, let us shout our slogan: Make development as smooth as silk! Most of the examples in the article are based on the mac version, because I am a mac, but there is no need to worry about the win version. If you want to break the formation, keep it in mind: command is the ctrl key.

vscode Tips - Cursor Operation

We use the arrow keys every day to operate the cursor. In fact, we also use many of its techniques subconsciously in muscle memory in our daily life. For example, by holding down the cmd key, you can go to the beginning and end of the line, but it is difficult to summarize, and it feels like it is blinding you. Let me give you a breakthrough point: granularity. In our daily use, the left and right arrow keys only have one character, that is, granularity is a character. If we think of the end of a word or sentence, it will be very troublesome; this sentence actually marks our focus: granularity; then, how to operate What about cursor granularity? [Recommended learning: "vscode tutorial"]

Horizontal direction

Combined with the direction keys

##WordsoptionctrllinecmdJust use home/endCode blockcmd shift \Ctrl shift \

Granularity	mac	win

vertical direction

GranularitymacwinHead of text/End of textCmd up and down arrow keysCtrl Home/End keyMove the current line of code up/downOption up and down arrow keysNote: [Move the current line up/down] is not a cursor but a code block operation (Because the cursor can be operated directly with the arrow keys), but it is very suitable to be placed here, so that it can match the horizontal direction; horizontally: line-cmd word-option; vertically document-cmd line-option;

Other cursor operations

MeaningmacwinUndo cursor processingCmd UCtrl U

Extension: [Select] operation only needs to add [shift]; [Delete] operation granularity is the same as cursor operation, in the opposite direction, add fn ( For example, all the content before the cursor in the deleted line is [cmd delete] and the content after the cursor is [cmd fn delete 】)

Cursor operation example

Cursor movement for words

Think To move the cursor directly to the entire word, that is, before or after function, you only need to press the Option (Ctrl key on Windows) and the left arrow key.

Move the cursor to the beginning or end of the line

Hold down the Cmd left arrow key (on Windows Home key), you can move the cursor to the first column of this line

Move the cursor to the first or last line of the document

Press Cmd and the up and down arrow keys (Ctrl Home/End key on Windows)

Code Block movement

Cmd Shift \ (Ctrl Shift \ on Windows), you can jump between the pair of curly braces.

Move current line up/down

Other cursor operations

Undo cursor processing

##Multiple cursor operations

So far, we have learned about single cursor movement, selection (actually moving plus the

shift key), deletion (selecting plus delete) and other operations, then, if we need What about operating multiple places at once? At this time we need to come to the advanced use of cursor operations, multi-cursor operations.

Regarding this topic, the key point is actually how to create multiple cursors at the required location, because after creation, the operation is consistent with the single cursor.

Basic operation - mouse creation of multiple cursors

Hold down "Option" on the keyboard (Alt on Windows), and then click to create a new Just click the cursor.

But obviously, this method is generally applicable but inconvenient. Every time we create a cursor, we need to find the position and click it. According to the 82 principle, we can use shortcut keys To implement the common 20% operations, the following mainly introduces three common scenarios.

Efficiency improvement operations

Processing scenesShortcut keysDetailed explanationSame elementCmd DSelect the element, then press the shortcut key, vscode will select the next one an identical element and create the cursor; press again to create, and so on. Up and down processingCmd Option down arrow keyCreate a cursor below the current cursor. Select multi-line processingOption Shift iSelect multiple lines of content, then press the shortcut key, vscode creates a Cursor

Extensions about cursor operations

Other cursor operations

Meaningmacwin##Undo cursor processing

Select and delete Lenovo

The [Select] operation only needs to add a [shift]; the [Delete] operation granularity is the same as the cursor operation, and vice versa Just add fn for the direction (for example, if you delete the line, all the content before the cursor is [cmd delete] and the content after the cursor is [cmd#] ##fn delete])

At this point, we understand the basic design concept of vscode itself for cursor operations.

Customized shortcut keys

But what if we are not used to it? Naturally, vscode is not so rigid. It supports customizing shortcut keys for behaviors, which is what we call commands. Here is one point that confused me before, that is, what we call creating cursor, moving, etc. corresponds to vscode. In fact, it is an embedded command. Only after you understand this can you customize it. I didn't understand it at first, so the question I kept thinking about was: how should I translate what I want to do.

Three steps: Find the place where

keyboard Shorycut is defined, find the corresponding operation, and bind the shortcut key to the operation.

Eg: Bind the operation of [Select all contents in brackets]Cmd Shift ]Shortcut key as an example

Find the definition Where keyboard Shorycut

find the corresponding operation

Bind shortcut keys for operations

Double-click-》Press the shortcut key that needs to be bound-》Press Enter to confirm (if you press the wrong key, just don’t press Enter)

More here In other words, the essence of shortcut keys is the binding of behaviors and specific keys [in specific scenarios]. They are described through JSON in vscode. We can view it by executing

>Open Keyboard Shortcuts(JSON) , if we need to implement an advanced shortcut key, we will need this knowledge.

Cmd U	Ctrl U

##AttributesCommand##WhenUnder what circumstances does this shortcut Key bindings can take effectKeyShortcut keysThe definition of when

Meaning	Remarks
Command value

requires more attention. All values ​​can be viewed in the

document. For advanced writing, VS Code Several basic operators are also supported. In this way we can write relatively complex conditional statements.

!

Negate. For example, if we want to bind a shortcut key when the cursor is not in the editor, then we can use !editorFocus, use ! Negate.
• ==
is equal to. In addition to being boolean, the when condition value can also be a string. For example,
• resourceExtname corresponds to the suffix name of the opened file. If we want to bind a shortcut key to the js file, we can use resourceExtname == .js. &&
And operator. We can combine multiple conditional values. For example, if I want the cursor to be in the editor and the editor is editing a js file, then I can use
• editorFocus && resourceExtname == .js. =~
Regular expression. Still using the above example, if I want to detect whether the file suffix is ​​js, I can also write
• resourceExtname =~ /js/ and judge it through regular expressions.
Summary

At this point, the sharing related to cursor operations is over. Regarding the understanding of vscode, it is not a silver bullet and can be used without it. But I always feel that programming itself is boring, but I still need this kind of joy of exploration. I am born with a cliff and there is no limit to learning. I will end this part of our sharing with the essays I wrote after learning at that time: human nature Laziness is not just about appearance, but also about thoughts. Being lazy to think is just getting used to filling pits when encountering them. Jumping into pits is almost an inevitable event. Be diligent in thinking and enjoy thinking.

Finally, let me sum it up in a jingle, I hope it will be helpful to you: Consider granularity when moving, use shortcut keys for multiple ones, self-binding is required for customization, and remember the shift key for operations.

For more knowledge about VSCode, please visit:

vscode Basic Tutorial

!

The above is the detailed content of It's worth understanding some vscode cursor operations to make development as smooth as silk!. For more information, please follow other related articles on the PHP Chinese website!