1. 程式人生 > 程式設計 >分享20個JavaScript 單行程式碼

分享20個JavaScript 單行程式碼

目錄
  • 1.獲取瀏覽器Cookie的值
  • 2.將RGB轉換為十六進位制
  • 3.複製到剪貼簿
  • 4.檢查日期是否有效
  • 5.查詢一年中的某一天
  • 6.大寫字串
  • 7.查詢兩個日期之間的天數
  • 8.清除所有Cookie
  • 9.生成隨機十六進位制
  • 10.從陣列中刪除重複項
  • 11.從URL獲取查詢引數
  • 12.從日期輸出時間
  • 13.檢查數字是偶數還是奇數
  • 14.求數字的平均值
  • 15.滾動到頂部
  • 16.反轉字串
  • 17.檢查陣列是否為空
  • 18.獲取選定的文字
  • 19.打亂陣列
  • 20.檢測暗模式

1.獲取瀏覽器Cookie的值

通過使用document.cookie訪問來檢索cookie的值。

const cookie = name => `; ${document.cookie}`.split(`; ${name}=`).pop().split(';').shift();

cookie('_ga');
// Result: "GA1.2.1929736587.1601974046"


2.將RGB轉換為十六進位制

const rgbToHex = (r,g,b) =>
  "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);

rgbToHex(0,51,255); 
// Result: #0033ff

3.複製到剪貼簿

使用navigator.clipboard.writeText可以輕鬆將文字複製到剪貼簿。

const copyToClipboard = (text) => navigator.clihttp://www.cppcns.com
pboard.writeText(text); copyToClipboard("Hello World");

4.檢查日期是否有效

使用以下程式碼段檢查給定日期是否有效。

const isDateValid = http://www.cppcns.com(...val) => !Number.isNaN(new Date(...val).valueOf());

isDateValid("December 17,1995 03:24:00");
// Result: true


5.查詢一年中的某一天

查詢給定日期。

const dayOfYear = (date) =>
  Math.floor((date - new Date(date.getFullYear(),0)) / 1000 / 60 / 60 / 24);

dayOfYear(new Date());
// Result: 272

6.大寫字串

沒有內建的大寫函式,但是我們可以使用以下程式碼實現大寫。

const capitalize = str => str.charAt(0).toUpperCase() + str.slice(1)

capitalize("follow for more")
// Result: Follow for more


7.查詢兩個日期之間的天數

使用以下程式碼段查詢給定兩個日期之間的天數。

const dayDif = (date1,date2) => Math.ceil(Math.abs(date1.getTime() - date2http://www.cppcns.com.getTime()) / 86400000)

dayDif(new Date("2020-10-21"),new Date("2021-10-22"))
// Result: 366


8.清除所有Cookie

你可以通過使用document.cookie訪問cookie並清除它,從而輕鬆地清除儲存在中的所有cookie

const clearCookies = document.cookie.split(';').forEach(cookie => document.cookie = cookie.replace(/^ +/,'').replace(/=.*/,`=;expires=${new Date(0).toUTCString()};path=/`));


9.生成隨機十六進位制

你可以使用Math.randompadEnd屬性生成隨機的十六進位制顏色。

const randomHex = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6,"0")}`;

console.log(randomHex());
// Result: #92b008


10.從陣列中刪除重複項

你可以使用Script中的Set輕鬆刪除重複項。這是救命稻草。

const removeDuplicates = (arr) => [...new Set(arr)];

console.log(removeDuplicates([1,2,3,4,5,6]));
// Result: [ 1,6 ]


11.從URL獲取查詢引數

你可以通過傳遞window.location或原始URLgoole.com?search=easy&page=3url輕鬆檢索查詢引數。

const getParameters = (URL) => {
  URL = ON.parse('{"' + decodeURI(URL.split("?")[1]).replace(/"/g,'\\"').replace(/&/g,'","').replace(/=/g,'":"') +'"}');
  return JSON.stringify(URL);
};


12.從日期輸出時間

我們可以從給定日期以hour::minutes::seconds的格式輸出時間。

const timeFromDate = date => date.toTimeString().slice(0,8);

console.log(timeFromDate(new Date(2021,10,17,30,0))); 
// Result: "17:30:00"


13.檢查數字是偶數還是奇數

const isEven = num => num % 2 === 0;

console.log(isEven(2)); 
// Result: True


14.求數字的平均值

使用reduce方法查詢多個數字的平均值。

const average = (...args) => args.reljiSxduce((a,b) => a + b) / args.length;

average(1,4);
// Result: 2.5


15.滾動到頂部

我們可以使用window.scrollTo(0,0)方法自動滾動到頂部。將x和y都設定為0。

const goToTop = () => window.scrollTo(0,0);

goToTop();


16.反轉字串

你可以使用splitreversejoin方法輕鬆反轉字串。

const reverse = str => str.split('').reverse().join('');

reverse('hello world');     
// Result: 'dlrow olleh'

17.檢查陣列是否為空

只要簡簡單單的一行程式碼就可以檢查陣列是否為空,返回truefalse

const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0;

isNotEmpty([1,3]);
// Result: true


18.獲取選定的文字

使用內建的getSelection屬性獲取使用者選擇的文字。

const getSelectedText = () => window.getSelection().toString();

getSelectedText();


19.打亂陣列

使用sortrandom方法打亂陣列非常容易。

const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random());

console.log(shuffleArray([1,4]));
// Result: [ 1,2 ]


20.檢測暗模式

使用以下程式碼可以檢查使用者的裝置是否處於暗模式。

const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches

console.log(isDarkMode) // Result: True or False


總結:

到此這篇關於分析20個JavaScript 單行程式碼的文章就介紹到這了,更多相關JavaScript 單行程式碼內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!