VSCode uses JavaScript to brush LeetCode configuration tutorial
foreword
There are still relatively few users who use JavaScript to brush LeetCode, and the configuration tutorial for VSCode is relatively fragmented. Now I will share my configuration.
Install the leetcode plugin
Install the LeetCode plugin in the extension of vscode. After installation, you can see the LeetCode icon on the right.
Click Sign into log in.
If you find that the account and password are correct, but you cannot log in, please change the LeetCode version to cn. Click LeetCode configuration, modify Endpointthe configuration item, change it to leetcode-cn, and try to log in again.
After logging in, select a topic, click the lower right corner Code nowto select a language, and start writing questions. You can also set the default language in LeetCode, so you don’t need to choose it every time. After
writing the code, you can click Submitor Testsubmit or sample test.
Install Debug LeetCode
There is also a need for debugging when writing a topic. You can install the Debug LeetCode plug-in in the store to debug Javascript without opening the browser every time.
After installation, you will find that debugthe and debug inputoptions have been added. After setting the breakpoint, the debug operation can be performed.
Configure Snippets User Snippets
For data structures such as linked lists and binary trees, Javascript does not have native support, so you can define the data structure in advance and call it directly when you encounter a specific problem. If it is a Windows system, find it in VSCode 文件 > 首选项 > 用户代码片段, and if it is a Mac system, find it in VSCode Code > 首选项 > 用户片段.
Click to select an existing code snippet or create a code snippet. 
Here is my current code snippet configuration.
{
// 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": "添加作者和时间注释"
}
}
Inputting in the code @lc_listautomatically inserts the corresponding code block, avoiding the need to initialize the data structure every time. The import of other data structures is the same.
