Detailed explanation of two quick ways to write console.log in vscode

(I) Method 1: Define it in advance directly in the script tag, only applicable to this HTML file!

 let add = function(a,b){
 	return a + b;
 };
 console.log(add(20,300));
 
 const { ['log']:C } = console;
 C(add(20,300));

(ii) Method 2: Press the tab key to quickly generate console.log, and the cursor is inside (). Press the tab key again and the cursor will automatically jump to the next line!
1. Open the vscode editor, select File -> Preferences -> User Snippets, enter javascript.json and press enter.
When we use it for the first time, we will find a commented code as follows:

{
	// Place your snippets for javascript here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is ​​what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	// "Print to console": {
	// "prefix": "log",
	// "body": [
	// "console.log('$1');",
	// "$2"
	// ],
	// "description": "Log output to console"
	// }
}

2. The following interval codes are used to release Example. The meanings of some parameters are as follows:
①prefix: The entry for code shortcut keys. Here we can set it according to personal habits. For example, if I set cl, then I can directly generate console.log with the tab key;
②body represents the main body of the code:
$1 indicates the position where the cursor first appears after the code is generated quickly
$2 is written below "console.log('$1');", which means that after the quick generation of console.log(), a line will be left after the code, and when the tab key is pressed again, the cursor will jump to $2 (the left line).

{
	// Place your snippets for javascript here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is ​​what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	"Print to console": {
		"prefix": "cl",
		"body": [
			"console.log('$1');",
			"$2"
		],
		"description": "Log output to console"
	}
}

This is the end of this article about two quick ways to write console.log in vscode. For more relevant vscode console.log writing content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future!