名称

简述

Auto Close Tag

自动闭合HTML标签

Auto Import

import提示

Auto Rename Tag

修改HTML标签时，自动修改匹配的标签

Babel JavaScript

babel插件，语法高亮

Babelrc

.babelrc文件高亮提示

Beautify css/sass/scss/less

css/sass/less格式化

Better Align

对齐赋值符号和注释

Better Comments

编写更加人性化的注释

Bookmarks

添加行书签

Bracket Lens

在闭合的括号处提示括号头部的代码

Bracket Pair Colorizer 2

用不同颜色高亮显示匹配的括号

Can I Use

HTML5、CSS3、SVG的浏览器兼容性检查

Code Outline

展示代码结构树

Code Runner

运行选中代码段（支持多数语言）

Code Spell checker

单词拼写检查

CodeBing

快速打开Bing并搜索，可配置搜索引擎

Color Highlight

颜色值在代码中高亮显示

Color Info

小窗口显示颜色值，rgb,hsl,cmyk,hex等等

Color Picker

拾色器

CSS-in-JS

CSS-in-JS高亮提示和转换

Dash

集成Dash

Debugger for Chrome

调试Chrome

Document This

注释文档生成

DotENV

.env文件高亮

Edit csv

编辑CSV文件

EditorConfig for VS Code

EditorConfig插件

Emoji

在代码中输入emoji

endy

将输入光标跳转到当前行最后面

Error Gutters

在行号处提示错误代码

ESLint

ESLint插件，高亮提示

File Peek

根据路径字符串，快速定位到文件

filesize

状态栏显示当前文件大小

Find-Jump

快速跳转到指定单词位置

Font-awesome codes for html

FontAwesome提示代码段

ftp-sync

同步文件到ftp

Git Blame

在状态栏显示当前行的Git信息

Git File History

快速浏览单文件历史提交变动

Git Graph

Git图形化视图，方便浏览和操作

Git History(git log)

查看git log

Git Tree Compare

Git树形比对，查看不同分支的差异

gitignore

.gitignore文件语法

GitLens

显示文件最近的commit和作者，显示当前行commit信息

GraphQL for VSCode

graphql高亮和提示

Guides

高亮缩进基准线

Gulp Snippets

Gulp代码段

Highlight Matching Tag

高亮匹配选中的标签

HTML CSS Class Completion

CSS class提示

HTML CSS Support

css提示（支持vue）

HTMLHint

HTML格式提示

htmltagwrap

快捷包裹html标签

htmltagwrap

包括HTML

Import Beautify

import分组、排序、格式化

Import Cost

行内显示导入（import/require）的包的大小

Indenticator

缩进高亮

IntelliSense for css class names

css class输入提示

JavaScript (ES6) code snippets

ES6语法代码段

JavaScript Standard Style

Standard风格

Jest Runner

支持执行Jest单个测试文件或单个用例

JS Refactor

代码重构工具，提取函数、变量重命名等等

JSON to TS

JSON结构转化为typescript的interface

JSON Tools

格式化和压缩JSON

jumpy

快速跳转到指定单词位置

language-stylus

Stylus语法高亮和提示

Less IntelliSense

less变量与混合提示

Lodash

Lodash代码段

Log Wrapper

生产打印选中变量的代码

markdownlint

Markdown格式提示

MochaSnippets

Mocha代码段

Node modules resolve

快速导航到Node模块

npm

运行npm命令

npm Intellisense

导入模块时，提示已安装模块名称

Output Colorizer

彩色输出信息

Partial Diff

对比两段代码或文件

Parameter Hints

在函数调用处指示参数名称

Path Autocomplete

路径完成提示

Path Intellisense

另一个路径完成提示

Polacode

将代码生成图片

PostCss Sorting

css排序

Prettier - Code formatter

prettier官方插件

Prettify JSON

格式化JSON

Project Manager

快速切换项目

Quokka.js

不需要手动运行，行内显示变量结果

Rainbow CSV

CSV文件使用彩虹色渲染不同列

React Native Storybooks

storybook预览插件，支持react

React Playground

为编辑器提供一个react组件运行环境，方便调试

React Standard Style code snippets

react standar风格代码块

REST Client

发送REST风格的HTTP请求

Sass

sass插件

Settings Sync

VSCode设置同步到Gist

Sort lines

排序选中行

Sort Typescript Imports

typescript的import排序

String Manipulation

字符串转换处理（驼峰、大写开头、下划线等等）

stylelint

css/sass/less代码风格

SVG Viewer

SVG查看器

Syncing

vscode设置同步到gist

Test Spec Generator

测试用例生成（支持chai、should、jasmine）

TODO Parser

Todo管理

Todo Todo Tree

收集代码中的TODO注释，支持快速搜索

Toggle Quotes

切换JS中的引号，" -> ' -> `

TS/JS postfix completion

ts/js后缀提示

TSLint

TypeScript语法检查

Types auto installer

自动安装@types声明依赖

TypeScript Hero

TypeScript辅助插件，管理import、outline等等

TypeScript Import

TS自动import

TypeScript Import Sorter

import整理排序

Typescript React code snippets

React Typescript代码段

TypeSearch

TS声明文件搜索

Version Lens

package.json文件显示模块当前版本和最新版本

vetur

Vue插件

Volar

Vue插件，支持Vue3

View Node Package

快速打开选中模块的主页和代码仓库

Visual Studio IntelliCode

基于AI的代码提示

VS Live Share

实时多人协助

VSCode Great Icons

文件图标拓展

vscode-database

操作数据库，支持mysql和postgres

vscode-icons

文件图标，方便定位文件

vscode-random

随机字符串生成器

vscode-spotify

集成spotify，播放音乐

vscode-styled-components

styled-components高亮支持

vscode-styled-jsx

styled-jsx高亮支持

Vue Peek

支持跳转到Vue组件定义文件

Vue TypeScript Snippets

Vue Typescript代码段

VueHelper

Vue2代码段（包括Vue2 api、vue-router2、vuex2）

Wallaby.js

实时测试插件

Wrap Console Log Lite

对选中代码快速console.log

名称

预览

Atom One Light Theme

bluloco-dark

bluloco-light

Enki Theme

eppz! (C# theme for Unity)

Eva Theme

Flat UI

GitHub Theme

Monokai Pro

New Moon VSCode

One Dark Pro

Plastic

spacegray-vscode

Splus

单词

功能描述

script

将JavaScript代码写在html文件中，例如：

<body>

<script>

//此处写JavaScript代码

</script>

</body>

引入.js格式的文件，例如：

<script src="此处写js文件所在的路径"></script>

单词

功能描述

alert()

弹出警告框

console.log()

控制台输出

单词

功能描述

var

使用var可以声明变量，例如：var num = 1;表示声明一个名称为num，值为1的变量

变量的合法命名：

1、只能由数字、字母、下划线和$组成，但不能以数字开头

2、不建议使用关键字和保留字

3、严格区分大小写，A和a是两个不同的变量

单词

功能描述

typeof

检测值或者变量的数据类型

单词

功能描述

NaN

表示非数字，是一个特殊的数值

isNaN()

用来检测一个值是否为NaN ，是的话返回true，否则返回false

单词

功能描述

Number

数值类型，所有的数字不分大小、不分正负、不分正负，都是数值类型

String

字符串类型，使用双引号或者单引号包裹的值

Boolean

布尔类型，true表示真，false表示假

Undefined

1、变量没有赋值，默认为undefined

2、变量声明提升时，变量的值也为undefined

undefined的类型也为undefined

Null

null表示空，用typeof检测null，结果为object

单词

功能描述

length

表示字符串的长度

单词

功能描述

charAt()

获取指定位置的字符

substring()

提取字符串中，介于两个指定下标之间的字符

substr()

在字符串中指定的位置处，提取指定数目的字符

slice()

提取字符串的某个部分，类似于substring() ，不同之处：

1、substring() 可以自动交换参数的位置，而slice()不行。

2、slice()的第一个参数可以是负数，而substring()不行

toUpperCase()

把字符串转换为大写

toLowerCase()

把字符串转换为小写

indexOf

返回字符串中指定字符首次出现的索引

单词

功能描述

Number()

将其他类型的值转换为数字

parseInt()

可以将参数转成整数

parseFloat()

可以将参数转成浮点数

String()

将其他类型的值转换成字符串，例如：String(123)

toString()

将其他类型的值转换成字符串，例如：(6).toString()

和String()的区别：

1、toString()无法转换null和undefined，String()可以转换null和undefined

2、toString()可增加进制参数，将字符串进行进制转换，String()不能转换进制

3、写法不同，可参考上述例子

Boolean()

将其他类型的值转换为布尔值

单词

功能描述

prompt()

弹出输入框

单词

功能描述

Array、Object、Function

数组、对象、函数

单词

功能描述

+

加法运算符。加号有两种作用，分别是加法和连字符

1、加号两边的操作数都是数字，则为加法

2、有一个操作数为字符串，则为连字符

-

减法运算符

*

乘法运算符

/

除法运算符

%

取余运算符。例如：a%b代表a除以b的余数，8 %5 = 3

单词

功能描述

toFixed()

指定小数点后面的位数

单词

功能描述

Math.pow(x,y)

返回x的y次幂（不常用，了解即可）

Math.sqrt()

返回一个数的平方根（不常用，了解即可）

Math.ceil()

向上取整

Math.floor()

向下取整

单词

功能描述

>

大于

<

小于

>=

大于等于

<=

小于等于

==

等于

!=

不等于

===

全等于

!==

不全等于

单词

功能描述

!

非

&&

与

||

或

单词

功能描述

=

赋值

+=

快捷赋值，例如： a+=1等价与a=a+1

-=

快捷赋值，例如： a-=1等价与a=a-1

*=

快捷赋值，例如： a*=1等价与a=a*1

/=

快捷赋值，例如： a/=1等价与a=a/1

%=

快捷赋值，例如： a%=1等价与a=a%1

++

自增运算 ，例如：

var num1 = 3;

num1++

console.log(num1)//num的值为4

--

自减运算，例如：

var num2 = 3;

num2--

console.log(num2)//num2的值为2

单词

功能描述

if

当指定条件为 true 时，执行if语句对应的代码

if...else

当条件为 true 时，执行if语句对应的代码

当条件为 false 时，执行else语句对应的代码

if...else if...

满足条件时，执行它所对应的代码

case

在switch中使用，表示要匹配的每一种情况

default

在switch中使用，表示默认情况，当不满足所有的case条件时，会执行默认情况

switch

根据不同的条件来执行不同的动作。示例：

switch (month) {

case 1:

alert("这个月有31天")

break;

case 4:

alert("这个月有30天")

break;

default:

alert("请输入正确的月份！！")

}

boolean_expression ? true_value : false_value

三元运算符，当条件表达式boolean_expression为真，执行表达式true_value，为假时执行表达式false_value

单词

功能描述

for

循环执行一段代码

示例： for(var i = 0; i <10;i++) {

console.log(i);

}

while

条件为真时循环执行代码块

do-while

while 循环的变体，语法：

do{

循环体

}while(循环执行条件)

注意事项：

1、do-while循环在检查条件之前一定会执行一次循环体

2、如果条件为真，就会继续执行循环体

3、如果条件为假，则会终止循环

单词

功能描述

break

用于退出循环

1、在switch中使用，用于跳出switch语句

2、在循环for、while中使用，直接跳出循环

continue

跳出当前循环，继续执行下一次循环

单词

功能描述

Array

数组， 用来存储一组值

new

与Array结合使用，创建数组，示例：new Array()

（new是JavaScript中的一个关键字，用来实例化对象的，后面的面向对象章节中会有详细的讲解，目前了解即可）

单词

功能描述

Array.isArray()

检测数据是否是一个数组，返回布尔值

单词

功能描述

length

返回数组长度

单词

功能描述

push()

在尾部插入新项

pop()

删除数组的最后一项

unshift()

在头部插入新项

shift()

删除数组的第一项

splice()

用于添加或删除数组的元素

slice()

从已有的数组中返回选定的元素

concat()

合并多个数组

reverse()

颠倒数组中元素的顺序

indexOf()

返回指定元素的索引值，如果不存在返回-1

includes()

判断一个数组是否包含指定的值，返回布尔值

• sort()

用于数组排序（涉及到函数知识，在函数一节再进行详细的讲解）

join()

将数组转成字符串

单词

功能描述

split()

将字符串转成数组