20 个实用的 JavaScript 单行代码|cookie|代码|字符串

推荐大家关注一个公众号

后台回复“大礼包”有惊喜礼包！

每日英文

Tired heart is always hovering between adhering to and giving up, indecisive. Trouble is that memory is good, the mind should not mind will stay in memory.

心累，就是常常徘徊在坚持和放弃之间，举棋不定。烦恼，就是记性太好，该记的，不该记的都会留在记忆里。

每日掏心话

成熟，不是你绷起脸，显得多么老道；不是你知道多少大是大非，懂得多少大道理，而是你能理解身边发生的小事都可能有它的不得已。

责编：乐乐 | 来自：JenK 链接：segmentfault.com/a/1190000040721650

往日回顾：

正文

大家好，我是小乐。

本文整理了一些实用的 JavaScript 单行代码，非常好用~~

获取浏览器Cookie的值

通过document.cookie来查找cookie值

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

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

颜色RGB转十六进制const rgbToHex = (r, g, b) => "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);

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

复制到剪贴板

借助navigator.clipboard.writeText可以很容易的讲文本复制到剪贴板

规范要求在写入剪贴板之前使用 Permissions API 获取“剪贴板写入”权限。但是，不同浏览器的具体要求不同，因为这是一个新的API。有关详细信息，请查看compatibility table and Clipboard availability in Clipboard。

const copyToClipboard = (text) => navigator.clipboard.writeText(text);

copyToClipboard("Hello World");

检查日期是否合法

使用以下代码段检查给定日期是否有效。

const isDateValid = (...val) => !Number.isNaN(new Date(...val).valueOf());

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

查找日期位于一年中的第几天const dayOfYear = (date) => Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24);

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

英文字符串首字母大写

Javascript没有内置的首字母大写函数，因此我们可以使用以下代码。

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

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

计算2个日期之间相差多少天const dayDif = (date1, date2) => Math.ceil(Math.abs(date1.getTime() - date2.getTime()) / 86400000)

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

清除全部Cookie

通过使用document.cookie访问cookie并将其清除，可以轻松清除网页中存储的所有cookie。

const clearCookies = document.cookie.split(';').forEach(cookie => document.cookie = cookie.replace(/^ +/, '').replace(/=.*/, `=;expires=${new Date(0).toUTCString()};path=/`));生成随机十六进制颜色

可以使用Math.random和padEnd属性生成随机的十六进制颜色。

搜索公众号前端技术精选回复“手册”，送你一份惊喜礼包。

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

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

数组去重

可以使用 JavaScript 中的Set轻松删除重复项

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

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

从 URL 获取查询参数

可以通过传递window.location或原始 URLgoole.com?search=easy&page=3轻松地从 url 检索查询参数

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

getParameters(window.location); // Result: { search : "easy", page : 3 }

或者更为简单的：

Object.fromEntries(new URLSearchParams(window.location.search)) // Result: { search : "easy", page : 3 }时间处理

我们可以从给定日期以hour::minutes::seconds格式记录时间。

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

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

校验数字是奇数还是偶数const isEven = num => num % 2 === 0;

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

求数字的平均值

使用reduce方法找到多个数字之间的平均值。

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

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