前言：并不是什么高深算法逻辑之类的，只是一些普通常用的代码片段，设置到vs code里面，减少工作时间成本，还有其他常用的代码块，欢迎评论给我建议。
设置用户代码片段方法 点这里
1.单行文字超出隐藏并显示省略号
"css1": {
"scope": "css,scss,less,stylus",
"prefix": "sld",
"body": [
"width:200rpx;",
"white-space: nowrap;",
"overflow: hidden;",
"text-overflow: ellipsis;",
"$1"
],
"description": "文字超出隐藏并显示省略号 单行 必须有宽度"
},
2.多行文字超出隐藏并显示省略号
"css2": {
"scope": "css,scss,less,stylus",
"prefix": "slm",
"body": [
"word-break: break-all;",
"display: -webkit-box;",
"-webkit-line-clamp: 2;",
"-webkit-box-orient: vertical;",
"overflow: hidden;",
"$1"
],
"description": "文字超出隐藏并显示省略号 多行"
},
3.纯css画三角形
"css3": {
"scope": "css,scss,less,stylus",
"prefix": "sjx",
"body": [
"width: 0;",
"height: 0;",
"border-width: 20px;",
"border-style: solid;",
"border-color: transparent transparent red transparent;",
"$1"
],
"description": "纯css画三角形"
},
4.绝对定位元素居中
"css4": {
"scope": "css,scss,less,stylus",
"prefix": "jz",
"body": [
"position: absolute;",
"left: 50%;",
"top: 50%;",
"transform: translate(-50%,-50%);",
"$1"
],
"description": "绝对定位元素居中（水平和垂直方向）"
},
5.块状元素居中
"css5": {
"scope": "css,scss,less,stylus",
"prefix": "jz2",
"body": [
"position: absolute;",
"top: 0;",
"left: 0;",
"bottom: 0;",
"right: 0;",
"margin: auto;",
"$1"
],
"description": "块状元素居中（水平和垂直方向）"
},
6.合并参数
"js1": {
"scope": "javascript,typescript",
"prefix": "hbcs",
"body": [
"const arrayConcat = (arr, ...args) => arr.concat(...args);",
"// arrayConcat([1], 2, [3], [[4]]) -> [1,2,3,[4]]",
"$1"
],
"description": "合并参数"
},
7.取数组不同项
"js2": {
"scope": "javascript,typescript",
"prefix": "qbtx",
"body": [
"const difference = (a, b) => { const s = new Set(b); return a.filter(x => !s.has(x)); };",
"// difference([1,2,3], [1,2]) -> [3]",
"$1"
],
"description": "取数组不同项"
},
8.取数组相同项
"js3": {
"scope": "javascript,typescript",
"prefix": "qtx",
"body": [
"const intersection = (a, b) => { const s = new Set(b); return a.filter(x => s.has(x)); };",
"// intersection([1,2,3], [4,3,2]) -> [2,3]",
"$1"
],
"description": "取数组相同项"
},
9.合并数组去重
"js4": {
"scope": "javascript,typescript",
"prefix": "hbqc",
"body": [
"const union = (a, b) => Array.from(new Set([...a, ...b]));",
"// union([1,2,3], [4,3,2]) -> [1,2,3,4]",
"$1"
],
"description": "合并数组去重"
},
10.数组取平均值
"js5": {
"scope": "javascript,typescript",
"prefix": "qpjz",
"body": [
"const average = arr => arr.reduce((acc, val) => acc + val, 0) / arr.length;",
"// average([1,2,3]) -> 2",
"$1"
],
"description": "数组取平均值"
},
11.过滤掉假值
"js6": {
"scope": "javascript,typescript",
"prefix": "gljz",
"body": [
"const compact = (arr) => arr.filter(v => v);",
"// compact([0, 1, false, 2, '', 3, 'a', 'e'*23, NaN, 's', 34]) -> [ 1, 2, 3, 'a', 's', 34 ]",
"$1"
],
"description": "过滤掉假值（false, null, 0, '', undefined 和 NaN）"
},
12.过滤掉数组中重复的值
"js7": {
"scope": "javascript,typescript",
"prefix": "glcfz",
"body": [
"const filterNonUnique = arr => arr.filter(i => arr.indexOf(i) === arr.lastIndexOf(i));",
// filterNonUnique([1,2,2,3,4,4,5]) -> [1,3,5]",
"$1"
],
"description": "过滤掉数组中重复的值"
},
13.计算数组中重复值出现的次数
"js8": {
"scope": "javascript,typescript",
"prefix": "jscfz",
"body": [
"const countOccurrences = (arr, value) => arr.reduce((a, v) => v === value ? a + 1 : a + 0, 0);",
"// countOccurrences([1,1,2,1,2,3], 1) -> 3",
"$1"
],
"description": "计算数组中重复值出现的次数"
},
14.滚动至顶部
"scroll to top": {
"scope": "javascript,typescript",
"prefix": "gotop",
"body": [
"const scrollToTop = _ => {",
" const c = document.documentElement.scrollTop || document.body.scrollTop;",
" if (c > 0) {",
" window.requestAnimationFrame(scrollToTop);",
" window.scrollTo(0, c - c / 8);",
" }",
"};",
"// scrollToTop()"
],
"description": "滚动至顶部"
},
15.获取两个日期间的差距
"Get days difference between dates": {
"scope": "javascript,typescript",
"prefix": "datecj",
"body": [
"const getDaysDiffBetweenDates = (dateInitial, dateFinal) => (dateFinal - dateInitial) / (1000 * 3600 * 24);",
"// getDaysDiffBetweenDates(new Date('2017-12-13'), new Date('2017-12-22')) -> 9",
"$1"
],
"description": "获取两个日期间的差距"
},
16.指定范围内的随机整数
"Random integer in range": {
"scope": "javascript,typescript",
"prefix": "sjzs",
"body": [
"const randomIntegerInRange = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;",
"// randomIntegerInRange(0, 5) -> 2",
"$1"
],
"description": "指定范围内的随机整数"
},
17.URL参数
"URL parameters": {
"scope": "javascript,typescript",
"prefix": "urlcs",
"body": [
"const getUrlParameters = url =>",
" url.match(/([^?=&]+)(=([^&]*))/g).reduce(",
" (a, v) => (a[v.slice(0, v.indexOf('='))] = v.slice(v.indexOf('=') + 1), a), {}",
");",
"// getUrlParameters('http://url.com/page?name=Adam&surname=Smith') -> {name: 'Adam', surname: 'Smith'}",
"$1"
],
"description": "URL参数"
},
