33个非常实用的JavaScript一行代码
33个非常实用的JavaScript一行代码
一、日期处理
1. 检察日期是否有效
该方法用于检测给出的日期是否有效:
const isDateValid = (...val) => !Number.isNaN(new Date(...val).valueOf());
isDateValid("December 17, 1995 03:24:00"); // true
2. 计算两个日期之间的间隔
该方法用于计算两个日期之间的间隔时间:
const dayDif = (date1, date2) => Math.ceil(Math.abs(date1.getTime() - date2.getTime()) / 86400000)
dayDif(new Date("2021-11-3"), new Date("2022-2-1")) // 90
距离过年还有90天~
3. 查找日期位于一年中的第几天
该方法用于检测给出的日期位于今年的第几天:
const dayOfYear = (date) => Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24);
dayOfYear(new Date()); // 307
2021年已经过去300多天了~
4. 时间格式化
该方法可以用于将时间转化为hour:minutes:seconds的格式:
const timeFromDate = date => date.toTimeString().slice(0, 8);
timeFromDate(new Date(2021, 11, 2, 12, 30, 0)); // 12:30:00
timeFromDate(new Date()); // 返回当前时间 09:00:00
二、字符串处理
1. 字符串首字母大写
该方法用于将英文字符串的首字母大写处理:
const capitalize = str => str.charAt(0).toUpperCase() + str.slice(1)
capitalize("hello world") // Hello world
2. 翻转字符串
该方法用于将一个字符串进行翻转操作,返回翻转后的字符串:
const reverse = str => str.split('').reverse().join('');
reverse('hello world'); // 'dlrow olleh'
3. 随机字符串
该方法用于生成一个随机的字符串:
const randomString = () => Math.random().toString(36).slice(2);
randomString();
4. 截断字符串
该方法可以从指定长度处截断字符串:
const truncateString = (string, length) => string.length < length ? string : `${string.slice(0, length - 3)}...`;
truncateString('Hi, I should be truncated because I am too loooong!', 36) // 'Hi, I should be truncated because...'
5. 去除字符串中的HTML
该方法用于去除字符串中的HTML元素:
const stripHtml = html => (new DOMParser().parseFromString(html, 'text/html')).body.textContent || '';
三、数组处理
1. 从数组中移除重复项
该方法用于移除数组中的重复项:
const removeDuplicates = (arr) => [...new Set(arr)];
console.log(removeDuplicates([1, 2, 2, 3, 3, 4, 4, 5, 5, 6]));
2. 判断数组是否为空
该方法用于判断一个数组是否为空数组,它将返回一个布尔值:
const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0;
isNotEmpty([1, 2, 3]); // true
3. 合并两个数组
可以使用下面两个方法来合并两个数组:
const merge = (a, b) => a.concat(b);
const merge = (a, b) => [...a, ...b];
四、数字操作
1. 判断一个数是奇数还是偶数
该方法用于判断一个数字是奇数还是偶数:
const isEven = num => num % 2 === 0;
isEven(996);
2. 获得一组数的平均值
const average = (...args) => args.reduce((a, b) => a + b) / args.length;
average(1, 2, 3, 4, 5); // 3
3. 获取两个整数之间的随机整数
该方法用于获取两个整数之间的随机整数
const random = (min, max) => Math.floor(Math.random() * (max - min + 1) + min);
random(1, 50);
4. 指定位数四舍五入
该方法用于将一个数字按照指定位进行四舍五入:
const round = (n, d) => Number(Math.round(n + "e" + d) + "e-" + d)
round(1.005, 2) //1.01
round(1.555, 2) //1.56
五、颜色操作
1. 将RGB转化为十六机制
该方法可以将一个RGB的颜色值转化为16进制值:
const rgbToHex = (r, g, b) => "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
rgbToHex(255, 255, 255); // '#ffffff'
2. 获取随机十六进制颜色
该方法用于获取一个随机的十六进制颜色值:
const randomHex = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, "0")}`;
randomHex();
六、浏览器操作
1. 复制内容到剪切板
该方法使用 navigator.clipboard.writeText 来实现将文本复制到剪贴板:
const copyToClipboard = (text) => navigator.clipboard.writeText(text);
copyToClipboard("Hello World");
2. 清除所有cookie
该方法可以通过使用 document.cookie 来访问 cookie 并清除存储在网页中的所有 cookie:
const clearCookies = document.cookie.split(';').forEach(cookie => document.cookie = cookie.replace(/^ +/, '').replace(/=.*/,
=;expires=${new Date(0).toUTCString()};path=/));
3. 获取选中的文本
该方法通过内置的 getSelection 属性获取用户选择的文本:
const getSelectedText = () => window.getSelection().toString();
getSelectedText();
4. 检测是否是黑暗模式
该方法用于检测当前的环境是否是黑暗模式,它是一个布尔值:
const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
console.log(isDarkMode)
5. 滚动到页面顶部
该方法用于在页面中返回顶部:
const goToTop = () => window.scrollTo(0, 0);
goToTop();
6. 判断当前标签页是否激活
该方法用于检测当前标签页是否已经激活:
const isTabInView = () => !document.hidden;
7. 判断当前是否是苹果设备
该方法用于检测当前的设备是否是苹果的设备:
const isAppleDevice = () => /Mac|iPod|iPhone|iPad/.test(navigator.platform);
isAppleDevice();
8. 是否滚动到页面底部
该方法用于判断页面是否已经底部:
const scrolledToBottom = () => document.documentElement.clientHeight + window.scrollY >= document.documentElement.scrollHeight;
9. 重定向到一个URL
该方法用于重定向到一个新的URL:
const redirect = url => location.href = url
redirect("https://www.google.com/")
10. 打开浏览器打印框
该方法用于打开浏览器的打印框:
const showPrintDialog = () => window.print()
七、其他操作
1. 随机布尔值
该方法可以返回一个随机的布尔值,使用Math.random()可以获得0-1的随机数,与0.5进行比较,就有一半的概率获得真值或者假值。
const randomBoolean = () => Math.random() >= 0.5;
randomBoolean();
2. 变量交换
可以使用以下形式在不适用第三个变量的情况下,交换两个变量的值:
[foo, bar] = [bar, foo];
3. 获取变量的类型
该方法用于获取一个变量的类型:
const trueTypeOf = (obj) => Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
trueTypeOf(''); // string
trueTypeOf(0); // number
trueTypeOf(); // undefined
trueTypeOf(null); // null
trueTypeOf({}); // object
trueTypeOf([]); // array
trueTypeOf(0); // number
trueTypeOf(() => {}); // function
4. 华氏度和摄氏度之间的转化
该方法用于摄氏度和华氏度之间的转化:
const celsiusToFahrenheit = (celsius) => celsius * 9/5 + 32;
const fahrenheitToCelsius = (fahrenheit) => (fahrenheit - 32) * 5/9;
celsiusToFahrenheit(15); // 59
celsiusToFahrenheit(0); // 32
celsiusToFahrenheit(-20); // -4
fahrenheitToCelsius(59); // 15
fahrenheitToCelsius(32); // 0
5. 检测对象是否为空
该方法用于检测一个JavaScript对象是否为空:
const isEmpty = obj => Reflect.ownKeys(obj).length === 0 && obj.constructor === Object;
转自
作者:CUGGZ 链接:https://juejin.cn/post/7025771605422768159
33个非常实用的JavaScript一行代码的更多相关文章
- 13 条高效实用的 JavaScript 单行代码
JavaScript可以实现很多令人惊奇的事! 从复杂的框架到处理API,有太多的东西可以学习. 甚至,仅用一行代码,它也能完成一些很棒的工作. 不信?那么请看这13条JavaScript单行代码,用 ...
- JavaScript一行代码获取公网IP及城市信息
废话不多说,直接上代码! <script type="text/javascript" src="http://pv.sohu.com/cityjson?ie=ut ...
- 从一行代码里面学点JavaScript
从一行代码里面学点JavaScript 现如今,JavaScript无处不在,因此关于JavaScript的新知识也是层出不穷.JavaScript的特点在于,要学习它的语法入门简简单,但是要精通使用 ...
- [转]从一行代码里面学点JavaScript
现如今,JavaScript无处不在,因此关于JavaScript的新知识也是层出不穷.JavaScript的特点在于,要学习它的语法入门简简单,但是要精通使用它的方式却是一件不容易的事. 来看看下面 ...
- 前端读者 | 从一行代码里面学点JavaScript
本文来自 @张小俊128:链接:http://www.html-js.com/article/A-day-to-learn-from-a-line-of-code-inside-the-JavaScr ...
- 「Python实用秘技08」一行代码解析地址信息
本文完整示例代码及文件已上传至我的Github仓库https://github.com/CNFeffery/PythonPracticalSkills 这是我的系列文章「Python实用秘技」的第8期 ...
- 【精心推荐】几款实用的 JavaScript 图形图表库
一款好的图表插件不是那么容易找到的.最近项目里需要实现统计图表功能,所以在网上搜罗了一圈,找到一些不错的图表插件,分享大家.众多周知,图形和图表要比文本更具表现力和说服力.这里给大家精心推荐几款实用的 ...
- 几款实用的 JavaScript 图形图表库
一款好的图表插件不是那么容易找到的.最近项目里需要实现统计图表功能,所以在网上搜罗了一圈,找到一些不错的图表插件,分享大家.众多周知,图形和图表要比文本更具表现力和说服力.这里给大家精心推荐几款实用的 ...
- C# 求精简用一行代码完成的多项判断 重复赋值
C# 求精简用一行代码完成的多项判断 重复赋值 哈哈,说实话,个人看着这么长的三元操作也麻烦,但是我也只想到了这样三元判断句中执行方法体能够写到一行,追求的终极目的是,用一行实现这个过程,而且简单,由 ...
随机推荐
- vue报错解决方案
Vue build faild 解决办法: https://blog.csdn.net/u011169370/article/details/83346176 ? jbcmVideo git:(oah ...
- 设置IDEA启动时不打开上次项目
步骤 1.启动IDEA,点击File 2.点击setting,在Appearance&Behavior中找到System Setting 3.取消勾选Reopen projects on st ...
- Mybatis-自定义类型处理器
类型转换器:mybatis中有一些常用的类型转换器,比如把Java中的short类型转换为mysql中的short类型:但是如果现在是Java中的Date类型,但是我想要存储到数据库中转换为Long类 ...
- 项目-MyBlog
项目 地址:https://gitee.com/zwtgit/my-blog 由Docker + SpringBoot2.0 + Mybatis + thymeleaf 等技术实现, 功能齐全.部署简 ...
- windows上用命令行我们查看机器cpu信息(使用计算器-程序员模式-四字时,查看系统类型)
查看系统是64位还是32位 C:\Users\qingshuic>wmic os get osarchitecture OSArchitecture 64-bitC:\Users\qingshu ...
- Qt 实现文字输入框,带字数限制
Qt 实现文字输入框,带字数限制 核心构思 核心的点在于,限制输入的字数:主要的方法为创建一个组合窗口 textChanged 这个信号,会在你输入字符之后发射,可以连接这个信号,在发射了信号之后,去 ...
- Codeforces Round #720 (Div. 2) B. Nastia and a Good Array(被坑好几次)1300
原题链接 Problem - B - Codeforces 题意 给一串数,要把任意两个相邻的数的最大公约数=1 每次可以进行一个操作: 取下标为i, j的数,和任意二数x,y,且min(ai,aj) ...
- nodejs的tream(流)解析与模拟文件读写流源码实现
什么是流? 可读流于可写流 双工流于转换流 背压机制与文件流模拟实现 一.什么是流? 关于流的概念早在1964年就有记录被提出了,简单的说"流"就是控制数据传输过程的程序,比如在那 ...
- 听说Integer有bug?1000不等于1000?
bug? 前几天有位朋友找我,说:"老哥,老哥,我好像发现了Integer一个bug,你帮我看看什么情况?",说完给了我两个很简单的demo,上代码. 100 == 100 100 ...
- Bugku CTF练习题---加密---ok
Bugku CTF练习题---加密---ok flag:flag{ok-ctf-1234-admin} 解题步骤: 1.观察题目,发现规律 2.发现所有内容都是ook写的, 直接上网搜索一下原因,发现 ...