首页 > 其他分享 >2024-02-21 js 工具类(一行代码)

2024-02-21 js 工具类(一行代码)

时间:2024-02-21 17:26:22浏览次数:30  
标签:02 arr const 21 console js cookie Result new

1. 获取浏览器 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. 复制到剪贴板

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

4.检查日期是否有效

const isDateValid = (...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, 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() - date2.getTime()) / 86400000)
dayDif(new Date("2020-10-21"), new Date("2021-10-22"))
// Result: 366

8.清除所有 Cookie

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

9. 生成随机十六进制

const randomHex = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, "0")}`;
console.log(randomHex());
// Result: #92b008

10. 数组去重

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 ]

11. 从 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 }

/---------------or-------------/

Object.fromEntries(new URLSearchParams(window.location.search))

12. 从日期获取“时分秒”格式的时间

const timeFromDate = date => date.toTimeString().slice(0, 8);
console.log(timeFromDate(new Date(2021, 0, 10, 17, 30, 0)));
// Result: "17:30:00"

13. 确认奇偶数

const isEven = num => num % 2 === 0;
console.log(isEven(2));
// Result: True
/---------------------or----------------/
const isEven = num => (num & 1) === 0
console.log(isEven(2));
// Result: True

14. 求平均值

const average = (...args) => args.reduce((a, b) => a + b) / args.length;
average(1, 2, 3, 4);
// Result: 2.5

15. 回到顶部

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

16. 翻转字符串

const reverse = str => str.split('').reverse().join('');
reverse('hello world');
// Result: 'dlrow olleh'

17. 检查数组是否为空

const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0;
isNotEmpty([1, 2, 3]);
// Result: true

18. 获取用户选定的文本

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

19. 打乱数组

const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random());
console.log(shuffleArray([1, 2, 3, 4]));
// Result: [ 1, 4, 3, 2 ]

20. 检测用户是否处于暗模式

const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
console.log(isDarkMode) // Result: True or False

 

注: 部分来源至网络。

标签:02,arr,const,21,console,js,cookie,Result,new
From: https://www.cnblogs.com/iuniko/p/18025710

相关文章

  • 2023 re:Invent 用 PartyRock 10 分钟构建你的 AI 应用
    前言一年一度的亚马逊云科技的re:Invent可谓是全球云计算、科技圈的狂欢,每次都能带来一些最前沿的方向标,这次也不例外。在看完一些keynote和介绍之后,我也去亲自体验了一些最近发布的内容。其中让我感受最深刻的无疑是PartyRock了。PartyRock真的算是做到了:能让任何人快速......
  • 面试题随笔-2月21日
    Java–异常/Exception–try/catch/finally的return顺序try块执行·try中的代码会先执行·try如果没用抛出异常则正常执行,如果存在return则会返回方法调用的地方catch块执行·如果try块中的代码抛出一个异常,与catch字句匹配的异常类型将被捕获并执行相应的cat......
  • ChemDraw Pro 2022:呈现专业化学绘图的极 致之作 mac/win版
    PerkinElmerChemDrawPro2022是一款功能强大的化学绘图软件,专为化学家、科研工作者和教育者设计。这款软件凭借其卓越的性能和丰富的功能,已经成为化学绘图领域的领导者。→→↓↓载PerkinElmerChemDrawPro2022mac/win版 ChemDrawPro2022提供了广泛的化学符号和工具,使......
  • 20240221总结
    P4311士兵占领考虑先把棋盘放满,判掉无解,并把问题转化为拿走最多的棋子。这个问题就一眼最大流了,对于行和列分别建M,N个节点,源点向行节点连流量为该行最多可删个数的边,列节点向汇点连该列最多可删个数的边,对于每个可放士兵的(i,j),从行节点i向列节点j连一条流量为1的边,跑最大流......
  • selenium执行js与浏览器操作
    执行js前置准备importtimefromseleniumimportwebdriverfromselenium.webdriver.edge.serviceimportServiceser=Service()ser.path=r'D:\xxx\chromedriver.exe'bro=webdriver.Chrome(service=ser)bro.get("https://www.baidu.com")#隐士......
  • JS 中的二进制 - Blob 与 ArrayBuffer
    零、参考资料《图解+实战》File、Blob、TypedArray、DataViewJavaScript也有操作二进制的一天:聊ArrayBuffer和Blob聊聊JS的二进制家族:Blob、ArrayBuffer和Buffer一、定义宏观:Blob-表示一个不可变、原始数据的类文件对象,可读不可写微观:ArrayBuffer-表示通用的原始......
  • 02-21 记SpringBoot3 打包成exe的过程以及一些问题
    先说说基本流程:(Windows环境,springbootv3.2.1)1.首先mavenpom.xml中加入如下代码<build><plugins><plugin><groupId>org.graalvm.buildtools</groupId><artifactId>native-maven-plugi......
  • RxJS中高阶映射操作符的全面讲解:switchMap, mergeMap, concatMap (and exhaustMap)
    原文链接:https://blog.angular-university.io/rxjs-higher-order-mapping/有一些在日常开发中常用的RxJS的操作符是高阶操作符:switchMap,mergeMap,concatMap,以及exhaustMap。举个例子,程序中大多数的网络请求都是通过以上某个操作符来完成的,所以为了能够写出几乎所有反应式编程,必须......
  • 利用jszip实现批量文件压缩下载
    介绍前端可以通过一个第三方库jszip,可以把多个文件以blob、base64或纯文本等形式,按自定义的文件结构,压缩成一个zip文件,然后通过浏览器download下来。官网:stuk.github.io/jszip/用法不难,直接看code://先封装一个方法,请求返回文件blobasyncfunctionfetchBlob(fetchUrl,meth......
  • USACO 2023 DEC bronze
    CandyCaneFeast第一题签到题,依题意模拟即可。注意细节,细节决定成败。CowntactTracing2贪心。读题奶牛传染,每个奶牛每晚传染左边和右边的奶牛。给定一个传染情况,求最开始最少有几个奶牛。我们记k为造成当前传染情况的传染天数。可以知道,传染的天数越多,被传染的牛就越......