使用vscode时快速生成console.log()
作者:
燕自浩 | 来源:发表于
2023-12-24 13:37 被阅读0次前言：在使用vscode开发进行调试时，我们经常要用到console.log()来调试代码，有什么好用的办法来快速生成，答案肯定是有的，下面跟随我来看一下是不是真的很好用。
- 安装插件JavaScript (ES6) code snippets
- 使用时直接按照插件规范即可，
比如我们要快速生成console.log()，那我们只需要键入clg即可
比如我们要快速生成for of循环，那我们只需要键入fof即可
比如我们要快速生成for in循环，那我们只需要键入fin即可
比如我们要快速生成forEach循环，那我们只需要键入fre即可
比如我们要快速生成setInterval(() => {})，那我们只需要键入sti即可
比如我们要快速生成setTimeout(() => {})，那我们只需要键入sto即可
比如我们要快速生成带export的function构造函数，那我们只需要键入enf即可
比如我们要快速生成function函数，那我们只需要键入nfn即可
下面列举下这个插件支持的范围
Snippets
Below is a list of all available snippets and the triggers of each one. The ⇥ means the TAB key.
Import and export
| Trigger |
Content |
imp→ |
imports entire module import fs from 'fs';
|
imn→ |
imports entire module without module name import 'animate.css'
|
imd→ |
imports only a portion of the module using destructing import {rename} from 'fs';
|
ime→ |
imports everything as alias from the module import * as localAlias from 'fs';
|
ima→ |
imports only a portion of the module as alias import { rename as localRename } from 'fs';
|
rqr→ |
require package require('');
|
req→ |
require package to const const packageName = require('packageName');
|
mde→ |
default module.exports module.exports = {};
|
env→ |
exports name variable export const nameVariable = localVariable;
|
enf→ |
exports name function export const log = (parameter) => { console.log(parameter);};
|
edf→ |
exports default function export default function fileName (parameter){ console.log(parameter);};
|
ecl→ |
exports default class export default class Calculator { };
|
ece→ |
exports default class by extending a base one export default class Calculator extends BaseClass { };
|
Class helpers
| Trigger |
Content |
con→ |
adds default constructor in the class constructor() {}
|
met→ |
creates a method inside a class add() {}
|
pge→ |
creates a getter property get propertyName() {return value;}
|
pse→ |
creates a setter property set propertyName(value) {}
|
Various methods
| Trigger |
Content |
fre→ |
forEach loop in ES6 syntax array.forEach(currentItem => {})
|
fof→ |
for ... of loop for(const item of object) {}
|
fin→ |
for ... in loop for(const item in object) {}
|
anfn→ |
creates an anonymous function (params) => {}
|
nfn→ |
creates a named function const add = (params) => {}
|
dob→ |
destructing object syntax const {rename} = fs
|
dar→ |
destructing array syntax const [first, second] = [1,2]
|
sti→ |
set interval helper method setInterval(() => {});
|
sto→ |
set timeout helper method setTimeout(() => {});
|
prom→ |
creates a new Promise return new Promise((resolve, reject) => {});
|
thenc→ |
adds then and catch declaration to a promise .then((res) => {}).catch((err) => {});
|
Console methods
| Trigger |
Content |
cas→ |
console alert method console.assert(expression, object)
|
ccl→ |
console clear console.clear()
|
cco→ |
console count console.count(label)
|
cdb→ |
console debug console.debug(object)
|
cdi→ |
console dir console.dir
|
cer→ |
console error console.error(object)
|
cgr→ |
console group console.group(label)
|
cge→ |
console groupEnd console.groupEnd()
|
clg→ |
console log console.log(object)
|
clo→ |
console log object with name console.log('object :>> ', object);
|
ctr→ |
console trace console.trace(object)
|
cwa→ |
console warn console.warn
|
cin→ |
console info console.info
|
clt→ |
console table console.table
|
cti→ |
console time console.time
|
cte→ |
console timeEnd console.timeEnd
|
本文标题：使用vscode时快速生成console.log()
本文链接：https://www.haomeiwen.com/subject/lyhhndtx.html
网友评论