今天我們分享一些單行代碼技巧,了解這些技巧,可以提升我們的工作效率,現(xiàn)在,我們一起來看一下今天的這些單行代碼技巧吧。
數(shù)組
1. 檢查變量是否是數(shù)組
const isArray = Array.isArray(arr);
const isArray = arr instanceof Array;
2. 數(shù)字?jǐn)?shù)組的和
const sum = (arr) => arr.reduce((a, b) => a + b);
3.從數(shù)組中刪除Falsy值
???????
const removeFalsyValues = (arr) => arr.filter(x => x);
// or
const removeFalsyValues = (arr) => arr.filter(Boolean);
4. 數(shù)字?jǐn)?shù)組的平均值
const average = (arr) => arr.reduce((a, b) => a + b) / arr.length;
5. 合并并刪除重復(fù)項
???????
const merge = (arr1, arr2) => [...new Set(arr1.concat(arr2))];
// or
const merge = (arr1, arr2) => [...new Set([...arr1, ...arr2])];
6. 合并兩個數(shù)組
???????
const merge = (arr1, arr2) => [].concat(arr1, arr2);
// or
const merge = (arr1, arr2) => [...arr1, ...arr2];
7. 打亂數(shù)組
const shuffle = (arr) => arr.slice().sort(() => Math.random() - 0.5);
8. 獲取數(shù)組的最后一個元素
???????
const lastElement = (arr) => arr[arr.length-1];
// or
const lastElement = (arr) => arr.slice(-1)[0];
// or
const lastElement = (arr) => arr.slice().pop();
9. 查找數(shù)組中的唯一值
const findUniqueValues = (arr) => arr.filter((i) => arr.indexOf(i) === arr.lastIndexOf(i));
10. 克隆數(shù)組
???????
const clone = (arr) => arr.slice();
// or
const clone = (arr) => [...arr];
字符串
11. 將字符串大寫
const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1);
12. 字符串反轉(zhuǎn)
???????
const reverseString = (str) => str.split("").reverse().join("");
// or
const reverseString = (str) => [...str].reverse().join();
13. 將字符串轉(zhuǎn)換為數(shù)字
???????
const toNumber = (str) => Number(str);
// or
const toNumber = (str) => +str;
14. 將字符串轉(zhuǎn)換為字符數(shù)組
???????
const toCharArray = (str) => str.split('');
// or
const toCharArray = (str) => [...str];
// or
const toCharArray = (str) => Array.from(str);
// or
const toCharArray = (str) => Object.assign([], str);
15. 將 Snake 大小寫轉(zhuǎn)換為 Camel 大小寫
const snakeToCamel = (str) => str.toLowerCase().replace(/(_\w)/g, (word) => word.toUpperCase().substr(1));
日期
16. 兩個日期之間的天數(shù)
const daysBetweenDates = (date1, date2) => Math.ceil(Math.abs(date1 - date2) / (1000 * 60 * 60 * 24));
17. 工作日約會時間
???????
const getWeekday = (date) => ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'][date.getDay()];
// or
const getWeekday = (date) => date.toLocaleString('en-US', {weekday: 'long'});
隨機(jī)
18. 隨機(jī)數(shù)生成器
???????
const randomNumber = (rangeStart, rangeEnd) => new Date().getTime() % rangeEnd + rangeStart;
// or
const randomNumber = (min, max) => Math.floor(Math.random() * (max - min + 1) + min);
19.隨機(jī)十六進(jìn)制顏色生成器
const randomHexColor = () => `#${Math.random().toString(16).slice(2, 8).padEnd(6, '0')}`;
20. 隨機(jī)布爾生成器
const randomBoolean = () => Math.random() >= 0.5;
驗(yàn)證?
21. 檢查數(shù)組是否為空
const isEmpty = (arr) => !Array.isArray(arr) || !arr.length;
22. 檢查數(shù)組是否包含值
???????
const includes = (arr, value) => arr.indexOf(value) != -1;
// or
const includes = (arr, value) => arr.includes(value);
23. 檢查日期是否是周末
const isWeekend = (date) => [5, 6].indexOf(date.getDay()) !== -1;
網(wǎng)絡(luò)實(shí)用程序?
24.復(fù)制到剪貼板
???????
const copyToClipboard = (text) =>
navigator.clipboard?.writeText && navigator.clipboard.writeText(text);
// Testing
copyToClipboard("Hello World!");
25.檢測深色模式
???????
const isDarkMode = () =>
window.matchMedia &&
window.matchMedia("(prefers-color-scheme: dark)").matches;
// Testing
console.log(isDarkMode());
總結(jié)
以上內(nèi)容,就是我今天想與你分享的全部內(nèi)容,希望這些內(nèi)容,能夠?qū)δ阌兴鶐椭?mark hidden color="red">文章來源:http://www.zghlxwxcb.cn/news/detail-778001.html
更多精彩教程歡迎B站搜索“千鋒教育”
千鋒前端浠浠呀老師HTML+CSS教程,零基礎(chǔ)web前端開發(fā)入門必看視頻文章來源地址http://www.zghlxwxcb.cn/news/detail-778001.html
到了這里,關(guān)于25個JavaScript One-Liner讓你更專業(yè)的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!