VSCode使用JavaScript刷LeetCode配置教程
前言
使用JavaScript刷LeetCode的用户还是比较少的，对于VSCode的配置教程也比较零碎，现就本人的配置做一个分享。
安装leetcode插件
在vscode的扩展中安装LeetCode插件，安装好后，在右侧可以看到LeetCode图标。
点击Sign in进行登陆。
如果发现账号密码都正确，但无法登陆，请把LeetCode版本改成cn。点击LeetCode配置，修改Endpoint配置项，改成leetcode-cn，再次尝试登陆即可。
登陆后选择好题目，点击右下角Code now即可选择语言，开始刷题。也可以在LeetCode里设置默认语言，就不需要每次都选择了.
写好代码，可以点击Submit或者Test进行提交或者样例测试。
安装Debug LeetCode
写题目还有debug需求，可以在商店安装Debug LeetCode插件，进行Javascript的Debug，而不需要每次开浏览器。
安装好后，会发现增加了debug和debug input选项。打好断点，就可以进行debug操作。
配置Snippets用户片段
对于链表、二叉树那些数据结构，Javascript并没有原生支持，所以可以通过事先定义好数据结构，在遇到具体的题目时直接调用。如果是Windows系统，在VSCode中找到文件 > 首选项 > 用户代码片段，如果是Mac系统，在VSCode中找到Code > 首选项 > 用户片段。
点击后选择已有代码片段或创建代码片段。
这里给出目前我的代码段配置。
{
// Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. 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": {
// "scope": "javascript,typescript",
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
"leetcode template m": {
"prefix": "@lc_m",
"body": [
"const _max = Math.max.bind(Math);",
"const _min = Math.min.bind(Math);",
"const _pow = Math.pow.bind(Math);",
"const _floor = Math.floor.bind(Math);",
"const _round = Math.round.bind(Math);",
"const _ceil = Math.ceil.bind(Math);",
"const log = console.log.bind(console);",
"// const log = _ => {}",
"$1"
],
"description": "LeetCode常用代码模板"
},
"leetcode template listnode": {
"prefix": "@lc_list",
"body": [
"/**************** 链表 ****************/",
"/**"," * 链表节点",
" * @param {*} val",
" * @param {ListNode} next",
" */","function ListNode(val, next = null) {",
" this.val = (val===undefined ? 0 : val);",
" this.next = (next===undefined ? null : next);",
"}",
"/**",
" * 将一个数组转为链表",
" * @param {array} array",
" * @return {ListNode}",
" */",
"const getListFromArray = (array) => {",
" let dummy = new ListNode()",
" let pre = dummy;",
" array.forEach(x => pre = pre.next = new ListNode(x));",
" return dummy.next;",
"}",
"/**",
" * 将一个链表转为数组",
" * @param {ListNode} list",
" * @return {array}",
" */",
"const getArrayFromList = (list) => {",
" let a = [];",
" while (list) {",
" a.push(list.val);",
" list = list.next;",
" }",
" return a;",
"}",
"/**",
" * 打印一个链表",
" * @param {ListNode} list ",
" */","const logList = (list) => {",
" let str = 'list: ';",
" while (list) {",
" str += list.val + '->';",
" list = list.next;",
" }",
" str += 'end';",
" log(str);",
"}",
"$1"
],
"description": "LeetCode常用代码模板-链表"
},
"leetcode template matrix": {
"prefix": "@lc_matrix",
"body": [
"/**************** 矩阵（二维数组） ****************/",
"/**",
" * 初始化一个二维数组",
" * @param {number} r 行数",
" * @param {number} c 列数",
" * @param {*} init 初始值",
" */",
"const initMatrix = (r, c, init = 0) => new Array(r).fill().map(_ => new Array(c).fill(init));",
"/**",
" * 获取一个二维数组的行数和列数",
" * @param {any[][]} matrix",
" * @return [row, col]",
" */",
"const getMatrixRowAndCol = (matrix) => matrix.length === 0 ? [0, 0] : [matrix.length, matrix[0].length];",
"/**",
" * 遍历一个二维数组",
" * @param {any[][]} matrix ",
" * @param {Function} func ",
" */",
"const matrixFor = (matrix, func) => {",
" matrix.forEach((row, i) => {",
" row.forEach((item, j) => {",
" func(item, i, j, row, matrix);",
" });",
" })",
"}",
"/**",
" * 获取矩阵第index个元素 从0开始",
" * @param {any[][]} matrix ",
" * @param {number} index ",
" */",
"function getMatrix(matrix, index) {",
" let col = matrix[0].length;",
" let i = ~~(index / col);",
" let j = index - i * col;",
" return matrix[i][j];","}",
"/**",
" * 设置矩阵第index个元素 从0开始",
" * @param {any[][]} matrix ",
" * @param {number} index ",
" */",
"function setMatrix(matrix, index, value) {",
" let col = matrix[0].length;",
" let i = ~~(index / col);",
" let j = index - i * col;",
" return matrix[i][j] = value;",
"}",
"$1"
],
"description": "LeetCode常用代码模板-矩阵"
},
"leetcode template tree": {
"prefix": "@lc_tree",
"body": [
"/**************** 二叉树 ****************/",
"/**",
" * 二叉树节点",
" * @param {*} val",
" * @param {TreeNode} left",
" * @param {TreeNode} right",
" */",
"function TreeNode(val, left = null, right = null) {",
" this.val = val;",
" this.left = left;",
" this.right = right;",
"}",
"/**",
" * 通过一个层次遍历的数组生成一棵二叉树",
" * @param {any[]} array",
" * @return {TreeNode}",
" */",
"function getTreeFromLayerOrderArray(array) {",
" let n = array.length;",
" if (!n) return null;",
" let index = 0;",
" let root = new TreeNode(array[index++]);",
" let queue = [root];",
" while(index < n) {",
" let top = queue.shift();",
" let v = array[index++];",
" top.left = v == null ? null : new TreeNode(v);",
" if (index < n) {",
" let v = array[index++];",
" top.right = v == null ? null : new TreeNode(v);",
" }",
" if (top.left) queue.push(top.left);",
" if (top.right) queue.push(top.right);",
" }",
" return root;",
"}",
"/**",
" * 层序遍历一棵二叉树 生成一个数组",
" * @param {TreeNode} root ",
" * @return {any[]}",
" */",
"function getLayerOrderArrayFromTree(root) {",
" let res = [];",
" let que = [root];",
" while (que.length) {",
" let len = que.length;",
" for (let i = 0; i < len; i++) {",
" let cur = que.shift();",
" if (cur) {",
" res.push(cur.val);",
" que.push(cur.left, cur.right);",
" } else {",
" res.push(null);",
" }",
" }",
" }",
" while (res.length > 1 && res[res.length - 1] == null) res.pop(); // 删掉结尾的 null",
" return res;",
"}",
"$1"
],
"description": "LeetCode常用代码模板-二叉树"
},
"leetcode template two search": {
"prefix": "@lc_two_s",
"body": [
"/**************** 二分查找 ****************/",
"/**",
" * 寻找>=target的最小下标",
" * @param {number[]} nums",
" * @param {number} target",
" * @return {number}",
" */",
"function lower_bound(nums, target) {",
" let first = 0;",
" let len = nums.length;",
"",
" while (len > 0) {",
" let half = len >> 1;",
" let middle = first + half;",
" if (nums[middle] < target) {",
" first = middle + 1;",
" len = len - half - 1;",
" } else {",
" len = half;",
" }",
" }",
" return first;",
"}",
"",
"/**",
" * 寻找>target的最小下标",
" * @param {number[]} nums",
" * @param {number} target",
" * @return {number}",
" */",
"function upper_bound(nums, target) {",
" let first = 0;",
" let len = nums.length;",
"",
" while (len > 0) {",
" let half = len >> 1;",
" let middle = first + half;",
" if (nums[middle] > target) {",
" len = half;",
" } else {",
" first = middle + 1;",
" len = len - half - 1;",
" }",
" }",
" return first;",
"}",
"$1"
],
"description": "LeetCode常用代码模板-二分查找"
},
"作者和时间注释": {
"prefix": "zs-Author & Time",
"body": [
"/**",
" * Created by preference on $CURRENT_YEAR/$CURRENT_MONTH/$CURRENT_DATE",
" */",
"$0"
],
"description": "添加作者和时间注释"
}
}
在代码中输入@lc_list即可自动插入对应的代码块，避免了每次都需要初始化数据结构。其他数据结构的导入同理。
