
JavaScript 功能强大,但重复编写代码费时费力。这十个实用的 JavaScript 代码片段能简化常见任务,显著提升您的开发效率。现在就开始学习吧!
判断元素是否在视口中
轻松判断元素是否可见:
const isInViewport = (element) => { const rect = element.getBoundingClientRect(); return ( rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth) );};
复制文本到剪贴板
快速复制文本到剪贴板,无需第三方库:
const copyToClipboard = (text) => { navigator.clipboard.writeText(text);};
打乱数组元素
一行代码随机打乱数组元素顺序:
立即学习“Java免费学习笔记(深入)”;
const shuffleArray = (array) => array.sort(() => Math.random() - 0.5);
扁平化多维数组
将嵌套数组转换为一维数组:
const flattenArray = (arr) => arr.flat(Infinity);
获取数组中唯一值
去除数组中的重复项:
const uniqueValues = (array) => [...new Set(array)];
生成随机十六进制颜色
轻松创建随机十六进制颜色代码:
const randomHexColor = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padStart(6, '0')}`;
函数防抖
防止函数被频繁调用,特别适用于搜索输入框:
const debounce = (func, delay) => { let timeoutId; return (...args) => { clearTimeout(timeoutId); timeoutId = setTimeout(() => func(...args), delay); };};
检测深色模式
判断用户系统是否处于深色模式:
const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
首字母大写
简单地将字符串首字母大写:
const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1);
生成随机整数
生成指定范围内的随机整数:
const randomInteger = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;
总结
这些代码片段能有效节省您的时间和精力。建议您收藏或整合到您的个人工具库中!
了解更多
更多 JavaScript 提示和技巧,请参考原文。
以上就是JavaScript 片段可以节省您的编码时间的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1500594.html
微信扫一扫
支付宝扫一扫