前端实用函数封装

1. 随机获取布尔值
const getRandomBoolean = () => Math.random() >= 0.5;
console.log(getRandomBoolean());
// a 50/50 chance of returning true or false

2. 检查日期是否为周末
const isWeekend = (date) => [0, 6].indexOf(date.getDay()) !== -1;
console.log(isWeekend(new Date(2021, 4, 14)));
// false (Friday)
console.log(isWeekend(new Date(2021, 4, 15)));
// true (Saturday)

3. 检查数字是偶数还是奇数
const isEven = (num) => num % 2 === 0;
console.log(isEven(5));
// false
console.log(isEven(4));
// true

4. 获取数组中的唯一值(数组去重)
const uniqueArr = (arr) => [...new Set(arr)];
console.log(uniqueArr([1, 2, 3, 1, 2, 3, 4, 5]));
// [1, 2, 3, 4, 5]

5. 检查变量是否为数组
const isArray = (arr) => Array.isArray(arr);
console.log(isArray([1, 2, 3]));
// true
console.log(isArray({ name: 'Ovi' }));
// false
console.log(isArray('Hello World'));
// false

6. 在两个数字之间生成一个随机数
const random = (min, max) => Math.floor(Math.random() * (max - min + 1) + min);
console.log(random(1, 50));
// could be anything from 1 - 50

7. 生成随机字符串
const randomString = () => Math.random().toString(36).slice(2);
console.log(randomString());

8. 滚动到页面顶部
const scrollToTop = () => window.scrollTo(0, 0);
scrollToTop();

9. 交换两个变量
[foo, bar] = [bar, foo];

10. 计算两个日期之间的天数
// 要计算两个日期之间的天数，我们首先找到两个日期之间的绝对值，然后将其除以86400000（等于一天中的毫秒数），最后将结果ceil并返回。
const daysDiff = (date, date2) => Math.ceil(Math.abs(date - date2) / 86400000);
console.log(daysDiff(new Date('2021-05-10'), new Date('2021-11-25')));
// 199

11. 将文字复制到剪贴板
const copyTextToClipboard = async (text) => {
  await navigator.clipboard.writeText(text);
};

12. 合并多个数组的不同方法
// Merge but don't remove the duplications
const merge = (a, b) => a.concat(b);
// Or
const merge = (a, b) => [...a, ...b];

// Merge and remove the duplications
const merge = [...new Set(a.concat(b))];
// Or
const merge = [...new Set([...a, ...b])];

13. 检查当前浏览器选项卡是否在视图/焦点内
const isTabInView = () => !document.hidden;  // Not hidden
isTabInView();
// true/false

14. 检查用户是否在Apple设备上
const isAppleDevice = () => /Mac|iPod|iPhone|iPad/.test(navigator.platform);
console.log(isAppleDevice);
// true/false

15. 短路评估
// 在将变量值分配给另一个变量时，可能要确保源变量不为null，未定义或为空。
const fullName = name || 'buddy';