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

青灯夜游
Release: 2022-11-04 09:56:53
forward
2886 people have browsed it

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

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

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

##Words option ctrl line cmd Just use home/end Code block cmd shift \ Ctrl shift \
Granularity mac win

vertical direction

Granularity mac win Head of text/End of text Cmd up and down arrow keys Ctrl Home/End key Move the current line of code up/down Option up and down arrow keys

Note: [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

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

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.

Its worth understanding some vscode cursor operations to make development as smooth as silk!

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

Its worth understanding some vscode cursor operations to make development as smooth as silk!

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)

Its worth understanding some vscode cursor operations to make development as smooth as silk!

Code Block movement

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

Its worth understanding some vscode cursor operations to make development as smooth as silk!

Move current line up/down

Its worth understanding some vscode cursor operations to make development as smooth as silk!

Other cursor operations

Undo cursor processing

Its worth understanding some vscode cursor operations to make development as smooth as silk!

##Multiple cursor operations

shiftkey), deletion (selecting plusdelete) 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.

Basic operation - mouse creation of multiple cursors

Its worth understanding some vscode cursor operations to make development as smooth as silk!

Efficiency improvement operations

Meaning mac win Undo cursor processing Cmd U Ctrl U So far, we have learned about single cursor movement, selection (actually moving plus theRegarding 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.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.
Processing scenes Shortcut keys Detailed explanation Same element Cmd D Select 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 processing Cmd Option down arrow key Create a cursor below the current cursor. Select multi-line processing Option Shift i Select multiple lines of content, then press the shortcut key, vscode creates a Cursor

Extensions about cursor operations

Other cursor operations

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 addfnfor the direction (for example, if you delete the line, all the content before the cursor is [cmddelete] and the content after the cursor is [cmd#]##fndelete])

Customized shortcut keys

keyboard Shorycutis 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

Its worth understanding some vscode cursor operations to make development as smooth as silk!

find the corresponding operation

Its worth understanding some vscode cursor operations to make development as smooth as silk!

Bind shortcut keys for operations

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

Its worth understanding some vscode cursor operations to make development as smooth as silk!

Meaning mac win ##Undo cursor processing At this point, we understand the basic design concept of vscode itself for cursor operations.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 whereDouble-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
Cmd U Ctrl U
##Attributes Command ##When Under what circumstances does this shortcut Key bindings can take effect Key Shortcut keys The 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,
  • resourceExtnamecorresponds to the suffix name of the opened file. If we want to bind a shortcut key to the js file, we can useresourceExtname == .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!

Related labels:
source:juejin.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!