search
HomeDevelopment ToolsVSCode(Animation demonstration) How to write code efficiently in VSCode? Tips sharing

This article uses animations to show you how to write code efficiently in VSCode. I hope it will be helpful to friends in need!

(Animation demonstration) How to write code efficiently in VSCode? Tips sharing

[Recommended study: "vscode introductory tutorial"]

Demonstrate how to write code efficiently

Some codes have been written repeatedly. Do I still need to write them again?
The answer is no , because as long as cv is enough, is there any method that is more elegant, efficient, and faster than cv? yú) skills?
The answer is yes, that is my own Quick Thirteen Whips
Here is a demonstration of how I wrote before I started the architecture高(mō)frequency(yú)Business code:

  • I want to trigger a click event and create a submitted function. In business, this submitted function appears very highly

  • Use some common function libraries in this function, then go back to the head and write the header file (the package that imports the function), and then come back to this function to continue writing the unfinished logic.
    (Animation demonstration) How to write code efficiently in VSCode? Tips sharing

The first whip: master the shortcut key customization

The first whip is especially important, because he is the entire shortcut The most basic knowledge of keys is the most important axis bone. If you don’t understand after reading it once, then read it again
Master the customization of shortcut keys, which can enrich your operating habits and avoid Shortcut key conflict, Keep the operating habits of each shortcut.
Because the shortcut keys of visual studio code are fast portable, you don’t have to worry about setting the shortcut keys again and again after changing computers or systems

Open the shortcut Panel

Press cmd k cmd s to quickly open the shortcut panel
Kapture 2021-05-19 at 23.48.06.gif
or call out the control panel (ctrl shift p) Enter Keyboard | keyboardFind
(Animation demonstration) How to write code efficiently in VSCode? Tips sharing

Get to know the default keyboard shortcuts (JSON)

Why you need to know the default keyboard shortcuts key?
Because it’s easy to use, you know the unmodified keyboard mapping and the default keyboard shortcut keys
(Animation demonstration) How to write code efficiently in VSCode? Tips sharing
It looks like this, it is a JSON file

(Animation demonstration) How to write code efficiently in VSCode? Tips sharing

Open the keybindings.json file of shortcut keys

vscode json文件.gif
Open the json file that stores user shortcuts according to the animationkeybindings.json , as long as the shortcut key is modified, it will have the following format

{
  "key": "cmd+k cmd+s",
  "command": "workbench.action.openGlobalKeybindings"
   "when": "editorHasCompletionItemProvider && textInputFocus && !editorReadonly"
}

This file is a user-defined JSON file, which is a mapping format

  • key Shortcut keys
  • command Shortcut key commands for vscode
  • when Conditions for the command to take effect

The keybindings.json file is a json file. The shortcut keys you have modified are stored here. When changing machines, you can copy the contents of this file to another machine, which is very nice~~
After all, this is what I do
(Animation demonstration) How to write code efficiently in VSCode? Tips sharing(Animation demonstration) How to write code efficiently in VSCode? Tips sharing

Customized shortcut keys

Commands that only require shortcut keyscommand or default shortcut key or directly enter the Chinese fuzzy word of the shortcut key to query the mapping of the shortcut key and modify the shortcut key
For the shortcut keys used in the article, the author will provide code snippets in the following format for easy query

{
  "key": "cmd+k cmd+a",
  "command": "workbench.action.openDefaultKeybindingsFile"
}

[The external link image transfer failed. The source site may have an anti-leeching mechanism. It is recommended to save the image. Upload directly (img-qo5Z56PF-1621655509407)(https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/a7b054961f614a63aee6f7dda082ec05~tplv-k3u1fbpfcp-watermark.image)]

第二鞭:定位篇

定位是快速写代码的核心操作,因为这个是日常编码高频率操作,高达90%以上,必须全部掌握下来,很实用 。
定位设计到代码块的精准定位,定位到类的定义、定位到应用、实现、快速查看、上一次之前的历史修改、设置某处的标签,然后快速找(vim直呼内行)到等等。

定位行

{ 
"key": "ctrl+g",               
"command": "workbench.action.gotoLine" 
},

场景示例:在浏览器找到你的文件在100行报错,找到原因后,定位在100行去修改代码

(Animation demonstration) How to write code efficiently in VSCode? Tips sharing

更多关于VSCode的相关知识,请访问:vscode教程!!

The above is the detailed content of (Animation demonstration) How to write code efficiently in VSCode? Tips sharing. For more information, please follow other related articles on the PHP Chinese website!

Statement
This article is reproduced at:csdn. If there is any infringement, please contact admin@php.cn delete
Visual Studio Professional and Enterprise: Paid Versions and FeaturesVisual Studio Professional and Enterprise: Paid Versions and FeaturesMay 10, 2025 am 12:20 AM

The difference between VisualStudioProfessional and Enterprise is in the functionality and target user groups. The Professional version is suitable for professional developers and provides functions such as code analysis; the Enterprise version is for large teams and has added advanced tools such as test management.

Choosing Between Visual Studio and VS Code: The Right Tool for YouChoosing Between Visual Studio and VS Code: The Right Tool for YouMay 09, 2025 am 12:21 AM

VisualStudio is suitable for large projects, VSCode is suitable for projects of all sizes. 1. VisualStudio provides comprehensive IDE functions, supports multiple languages, integrated debugging and testing tools. 2.VSCode is a lightweight editor that supports multiple languages ​​through extension, has a simple interface and fast startup.

Visual Studio: A Powerful Tool for DevelopersVisual Studio: A Powerful Tool for DevelopersMay 08, 2025 am 12:19 AM

VisualStudio is a powerful IDE developed by Microsoft, supporting multiple programming languages ​​and platforms. Its core advantages include: 1. Intelligent code prompts and debugging functions, 2. Integrated development, debugging, testing and version control, 3. Extended functions through plug-ins, 4. Provide performance optimization and best practice tools to help developers improve efficiency and code quality.

Visual Studio vs. VS Code: Pricing, Licensing, and AvailabilityVisual Studio vs. VS Code: Pricing, Licensing, and AvailabilityMay 07, 2025 am 12:11 AM

The differences in pricing, licensing and availability of VisualStudio and VSCode are as follows: 1. Pricing: VSCode is completely free, while VisualStudio offers free community and paid enterprise versions. 2. License: VSCode uses a flexible MIT license, and the license of VisualStudio varies according to the version. 3. Usability: VSCode is supported across platforms, while VisualStudio performs best on Windows.

Visual Studio: From Code to ProductionVisual Studio: From Code to ProductionMay 06, 2025 am 12:10 AM

VisualStudio supports the entire process from code writing to production deployment. 1) Code writing: Provides intelligent code completion and reconstruction functions. 2) Debugging and testing: Integrate powerful debugging tools and unit testing framework. 3) Version control: seamlessly integrate with Git to simplify code management. 4) Deployment and Release: Supports multiple deployment options to simplify the application release process.

Visual Studio: A Look at the Licensing LandscapeVisual Studio: A Look at the Licensing LandscapeMay 05, 2025 am 12:17 AM

VisualStudio offers three license types: Community, Professional and Enterprise. The Community Edition is free, suitable for individual developers and small teams; the Professional Edition is annually subscribed, suitable for professional developers who need more functions; the Enterprise Edition is the highest price, suitable for large teams and enterprises. When selecting a license, project size, budget and teamwork needs should be considered.

The Ultimate Showdown: Visual Studio vs. VS CodeThe Ultimate Showdown: Visual Studio vs. VS CodeMay 04, 2025 am 12:01 AM

VisualStudio is suitable for large-scale project development, while VSCode is suitable for projects of all sizes. 1. VisualStudio provides comprehensive development tools, such as integrated debugger, version control and testing tools. 2.VSCode is known for its scalability, cross-platform and fast launch, and is suitable for fast editing and small project development.

Visual Studio vs. VS Code: Comparing the Two IDEsVisual Studio vs. VS Code: Comparing the Two IDEsMay 03, 2025 am 12:04 AM

VisualStudio is suitable for large projects and Windows development, while VSCode is suitable for cross-platform and small projects. 1. VisualStudio provides a full-featured IDE, supports .NET framework and powerful debugging tools. 2.VSCode is a lightweight editor that emphasizes flexibility and extensibility, and is suitable for various development scenarios.

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Atom editor mac version download

Atom editor mac version download

The most popular open source editor

WebStorm Mac version

WebStorm Mac version

Useful JavaScript development tools

SublimeText3 English version

SublimeText3 English version

Recommended: Win version, supports code prompts!

Dreamweaver Mac version

Dreamweaver Mac version

Visual web development tools

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.