js获得相同css的第几个,vue,css,js用户代码片段（vs code）
前言：并不是什么高深算法邏輯之類的，只是一些普通常用的代碼片段，設(shè)置到vs code里面，減少工作時(shí)間成本，還有其他常用的代碼塊，歡迎評(píng)論給我建議。
設(shè)置用戶代碼片段方法 點(diǎn)這里
1.單行文字超出隱藏并顯示省略號(hào)
"css1": {
"scope": "css,scss,less,stylus",
"prefix": "sld",
"body": [
"width:200rpx;",
"white-space: nowrap;",
"overflow: hidden;",
"text-overflow: ellipsis;",
"$1"
],
"description": "文字超出隱藏并顯示省略號(hào) 單行 必須有寬度"
},
復(fù)制代碼
2.多行文字超出隱藏并顯示省略號(hào)
"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": "文字超出隱藏并顯示省略號(hào) 多行"
},
復(fù)制代碼
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畫三角形"
},
復(fù)制代碼
4.絕對(duì)定位元素居中
"css4": {
"scope": "css,scss,less,stylus",
"prefix": "jz",
"body": [
"position: absolute;",
"left: 50%;",
"top: 50%;",
"transform: translate(-50%,-50%);",
"$1"
],
"description": "絕對(duì)定位元素居中(水平和垂直方向)"
},
復(fù)制代碼
5.塊狀元素居中
"css5": {
"scope": "css,scss,less,stylus",
"prefix": "jz2",
"body": [
"position: absolute;",
"top: 0;",
"left: 0;",
"bottom: 0;",
"right: 0;",
"margin: auto;",
"$1"
],
"description": "塊狀元素居中(水平和垂直方向)"
},
復(fù)制代碼
6.合并參數(shù)
"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": "合并參數(shù)"
},
復(fù)制代碼
7.取數(shù)組不同項(xiàng)
"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": "取數(shù)組不同項(xiàng)"
},
復(fù)制代碼
8.取數(shù)組相同項(xiàng)
"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": "取數(shù)組相同項(xiàng)"
},
復(fù)制代碼
9.合并數(shù)組去重
"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": "合并數(shù)組去重"
},
復(fù)制代碼
10.數(shù)組取平均值
"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": "數(shù)組取平均值"
},
復(fù)制代碼
11.過(guò)濾掉假值
"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": "過(guò)濾掉假值(false, null, 0, '', undefined 和 NaN)"
},
復(fù)制代碼
12.過(guò)濾掉數(shù)組中重復(fù)的值
"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": "過(guò)濾掉數(shù)組中重復(fù)的值"
},
復(fù)制代碼
13.計(jì)算數(shù)組中重復(fù)值出現(xiàn)的次數(shù)
"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": "計(jì)算數(shù)組中重復(fù)值出現(xiàn)的次數(shù)"
},
復(fù)制代碼
14.滾動(dòng)至頂部
"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": "滾動(dòng)至頂部"
},
復(fù)制代碼
15.獲取兩個(gè)日期間的差距
"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": "獲取兩個(gè)日期間的差距"
},
復(fù)制代碼
16.指定范圍內(nèi)的隨機(jī)整數(shù)
"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": "指定范圍內(nèi)的隨機(jī)整數(shù)"
},
復(fù)制代碼
17.URL參數(shù)
"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參數(shù)"
},
復(fù)制代碼
18.后續(xù)更新
總結(jié)
以上是生活随笔為你收集整理的js获得相同css的第几个,vue,css,js用户代码片段（vs code）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： python英语词频_【我爱背单词】从3
- 下一篇： Vue2版本 六边形 蜂窝 Demo