LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

超多JavaScript实用小妙招

admin
2025年5月7日 12:20 本文热度 127

字符串处理

1. 生成随机字符串

const randomString = (length = 8) => {  return Math.random().toString(36).slice(22 + length);};// 示例:randomString() → "4f9d2fe3"

2. 首字母大写

const capitalize = (str) => {  return str.charAt(0).toUpperCase() + str.slice(1);};// 示例:capitalize("hello") → "Hello"

数组操作

3. 数组去重

const uniqueArray = (arr) => [...new Set(arr)];// 示例:uniqueArray([1,2,2,3]) → [1,2,3]

4. 数组乱序(洗牌算法)

const shuffleArray = (arr) => {  return arr.sort(() => Math.random() - 0.5);};// 示例:shuffleArray([1,2,3,4]) → 随机顺序

对象处理

5. 深拷贝(简易版)

const deepClone = (obj) => JSON.parse(JSON.stringify(obj));// 注意:无法复制函数和循环引用

6. 对象属性过滤

const filterObject = (obj, keys) => {  return Object.fromEntries(    Object.entries(obj).filter(([key]) => keys.includes(key))  );};// 示例:filterObject({a:1, b:2}, ['a']) → {a:1}

数字处理

7. 千分位格式化


const formatNumber = (num) => {  return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g",");};// 示例:formatNumber(1234567) → "1,234,567"


8. 生成范围随机数

const randomInRange = (min, max) => {  return Math.floor(Math.random() * (max - min + 1)) + min;};// 示例:randomInRange(5, 10) → 5~10之间的整数

DOM 相关

9. 复制内容到剪贴板

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

10. 检测元素是否可见

const isElementVisible = (el) => {  return el.offsetParent !== null;};

日期处理

11. 格式化日期

const formatDate = (date = new Date(), format = 'YYYY-MM-DD') => {  const pad = n => n.toString().padStart(2'0');  return format    .replace('YYYY', date.getFullYear())    .replace('MM'pad(date.getMonth() + 1))    .replace('DD'pad(date.getDate()));};// 示例:formatDate() → "2023-08-15"

函数优化

12. 防抖函数(Debounce)

const debounce = (fn, delay = 300) => {  let timer;  return (...args) => {    clearTimeout(timer);    timer = setTimeout(() => fn.apply(this, args), delay);  };};// 适用场景:搜索框输入

13. 节流函数(Throttle)

const throttle = (fn, interval = 300) => {  let lastTime = 0;  return (...args) => {    const now = Date.now();    if (now - lastTime >= interval) {      fn.apply(this, args);      lastTime = now;    }  };};// 适用场景:滚动事件

14. 类型判断增强版

const typeOf = (obj) => {  return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();};// 示例:typeOf([]) → "array"

15. 本地存储封装

const storage = {  set(key, value) => localStorage.setItem(key, JSON.stringify(value)),  get(key) => {    try {      return JSON.parse(localStorage.getItem(key));    } catch (e) {      return null;    }  }};


该文章在 2025/5/7 12:20:37 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2025 ClickSun All Rights Reserved