几个JavaScript代码，让你开发起来更加轻松！

小知识，大挑战！本文正在参与“程序员必备小知识”创作活动

前言

平常开发业务的时候，重复造轮子，重复功能总是写了一遍又一遍，给大家一点笑方法，让大家开发起来更轻松！

1.判断当前选项卡是否在视图/焦点中

我们可以使用document.hidden属性检查当前标签页是否在视图/焦点中。

const isBrowserTabInView = () => document.hidden; 
isBrowserTabInView(); // true-即当前页面选项卡已经被隐藏，false则目前在该页面中

2.检查元素当前是否处于焦点

我们可以使用document.activeElement属性检查元素当前是否处于焦点。

• 文档刚加载完，document.activeElement指向document.body；
• 文档加载期间，document.activeElement指向null。

const elementIsInFocus = (el) => (el === document.activeElement); 
elementIsInFocus(document.getElementById('id')) // true-处于焦点，false-不处于

3.检查当前用户是否在Apple设备上

我们可以navigator.platform用来检查当前用户是否在Apple设备上。

const isAppleDevice = /Mac|iPod|iPhone|iPad/.test(navigator.platform); 
console.log(isAppleDevice);

4.滚动到页面顶部

window.scrollTo()方法将使用x和y坐标滚动到。如果将它们设置为零和零，则将滚动到页面顶部。
注意：Internet Explorer不支持该.scrollTo()方法。

const goToTop = () => window.scrollTo(0, 0); goToTop();

5.日期格式化-- 这是前端开发肯定会遇到的东西(也可以使用 moment.js 库哦)

/** 
    * @param {string} format - 格式类型 
    * @param {number} timestamp - 时间戳 
    * @return {string} 
*/ 
function formatDate(format='Y-M-D h:m', timestamp=Date.now()){
    let date = new Date(timestamp) 
    let dateInfo = { 
        Y: date.getFullYear(), 
        M: date.getMonth()+1, 
        D: date.getDate(), 
        h: date.getHours(), 
        m: date.getMinutes(), 
        s: date.getSeconds() 
    } 
    let formatNumber = (n) => n > 10 ? n : '0' + n 
    let res = format 
        .replace('Y', dateInfo.Y) 
        .replace('M', dateInfo.M) 
        .replace('D', dateInfo.D) 
        .replace('h', formatNumber(dateInfo.h)) 
        .replace('m', formatNumber(dateInfo.m)) 
        .replace('s', formatNumber(dateInfo.s)) 
    return res 
 }

预测

formatDate() // '2021-9-27 14:48'
formatDate('M月D日 h:m') // '9月27日 14:48'
formatDate('h:m Y-M-D', 1582526221604) // '14:37 2020-2-24'

实战

5.不需要任何结构内容直接复制方式

copyShaneUrl(shareLink: string) { 
    const input = document.createElement('input') // 直接构建
    input input.value = shareLink // 设置内容 
    document.body.appendChild(input) // 添加临时实例 
    input.select() // 选择实例内容 
    document.execCommand('Copy') // 执行复制 
    document.body.removeChild(input) // 删除临时实例 
}