20 个 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
可以轻松将文本复制到剪贴板。
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
查找两个日期之间的天数
使用以下代码段查找给定两个日期之间的天数。
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);
};
从日期输出时间
我们可以从给定日期以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
滚动到顶部
你可以使用window.scrollTo(0, 0)
方法自动滚动到顶部。将x
和y
都设置为0。
const goToTop = () => window.scrollTo(0, 0);goToTop();
反转字符串
你可以使用split
、reverse
和join
方法轻松反转字符串。
const reverse = str => str.split('').reverse().join('');reverse('hello world');
// Result: 'dlrow olleh'
检查数组是否为空
只要简简单单的一行代码就可以检查数组是否为空,返回true
或false
。
const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0;isNotEmpty([1, 2, 3]);
// Result: true
获取选定的文本
使用内置的getSelection
属性获取用户选择的文本。
const getSelectedText = () => window.getSelection().toString();getSelectedText();
打乱数组
使用sort
和random
方法打乱数组非常容易。
const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random());console.log(shuffleArray([1, 2, 3, 4]));
// Result: [ 1, 4, 3, 2 ]
检测暗模式
使用以下代码可以检查用户的设备是否处于暗模式。
const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matchesconsole.log(isDarkMode) // Result: True or False
总结
希望这20个单行代码杀手锏能帮助到你,请关注一下我吧!!
点击下方卡片/微信搜索,关注公众号“天宇文创意乐派”(ID:gh_cc865e4c536b)
20 个 JavaScript 单行代码杀手锏相关推荐
- JavaScript单行代码
JavaScript单行代码 1.ID随机生成 当你执行原型制作并且需要唯一的ID时,此功能可以成为你的首选项. const a = Math.random().toString(36).substr ...
- 25个有用的 JavaScript 单行代码
英文 | https://medium.com/@daaaan 翻译整理 | web前端开发(ID:web_qdkf) JavaScript 有很多单行代码的实用例子,它们可以做很多强大的事情,无论你 ...
- 38 个非常有用的 JavaScript 单行代码汇总
在今天的文章中,我们整理了38个JavaScript 单行代码可以实现的功能技巧,这些技巧都是我平时收集整理下来的,有的一个功能的实现,可能会有两种方法,具体用那种,可以根据自己的情况来选择,其实,技 ...
- 20 个杀手级 JavaScript 单行代码
杀手级的TypeScript功能:const断言_短暂又灿烂的的博客-CSDN博客我发现官方的 TypeScript 文档非常有用,但是总觉得有点过于学术化并且枯燥无味.每当我发现一个新功能时,我想要 ...
- 13个JavaScript单行式代码
13个JavaScript单行式代码 1.随机获取布尔值(true/false) 此函数将使用Math.random()方法返回布尔值(真或假).Math.random将创建一个介于0和1之间的随机数 ...
- 20个非常有用的Python单行代码
有用的 Python 单行代码片段,只需一行代码即可解决特定编码问题! 在本文中,将分享20 个 Python 一行代码,你可以在 30 秒或更短的时间内轻松学习它们.这种单行代码将节省你的时间,并使 ...
- 【建议收藏】20个Python非常有用的单行代码
有用的 Python 单行代码片段,只需一行代码即可解决特定编码问题! 在本文中,今天将分享20 个 Python 一行代码,你可以在 30 秒或更短的时间内轻松学习它们.这种单行代码将节省你的时间, ...
- JavaScript常用代码
在这存一下JavaScript常用代码: 1.封装输出 1 var log = function() { 2 console.log.apply(console, arguments) 3 } 4 5 ...
- javascript 常用代码大全
javascript 常用代码大全 //打开模式对话框 function doSelectUser(txtId) { strFeatures="dialogWidth=500px;dialo ...
最新文章
- 扩增子三部曲:2分析流程(共7节万字)
- vim 直接跳转到标签
- C#学习笔记:多态与隐藏,覆盖
- 陈一舟:每个人风口来的时间不一样
- Linux 基础学习:文件权限与种类
- c#设计模式学习1之工厂模式
- 事件委托 EventHandler 。
- 几个简单的OpenCV程序
- mysql 备用字段_数据库设计之备用字段
- [转载]对称加密DES和TripleDES
- python 3.6.5 模拟银行转账系统
- 修改linux文本模式下的分辨率
- Zotero文献管理 | Zotero下载使用、Zotero+坚果云实现多设备文献同步
- Java实现数组排序
- 个人学习计划(计算机专业),大学生个人学习计划范文
- 计算机一级考试ppt知识点,计算机一级考试考点:PPT演示文稿
- Android使用高德地图地理围栏定位自动发送短信
- 看mysql安装在哪怎么看_mysql安装在哪儿怎么查看?
- mysql jena rdf_RDF和Jena RDF API简介
- Javris OJ - pwn level5(mmap和mprotect练习)(_libc_csu_init中的通用gedget的使用)
热门文章
- 图像主结构的提取方法
- 路由器 刷 linux系统版本,一个小型的无线路由器 Linux 系统OpenWRT[转]
- 【洛谷】NOIP提高组模拟赛Day2【动态开节点/树状数组】【双头链表模拟】
- 【对线面试官】阿里面试经历,有些人走一步看一步就挂了
- ca机构将会被区块链取代
- 公关人员活用Koomail给客户群发邮件
- 30岁女IT月薪3W的背后:从数据报表到数仓、中台,这工具帮了大忙
- javaweb基础打卡12
- Java游戏碟中谍,煮 Retrofit 论 RxJava(一)
- 先学vba还是python-以Excel处理为目的学习python还是VBA?