js常用功能代码……

冷不防 2021-07-24 22:54 377阅读 0赞

**目录**

一、获取一个随机布尔值（true/false）

二、检查日期是否为工作日

三、反转字符串

四、检查是否是奇数

五、从日期中获取时间

六、保留小数点（非四舍五入）

七、检查元素是否为聚焦状态

八、检查浏览器是否支持触摸事件

九、检查当前用户是否为苹果设备

十、滚动到页面顶部

十一、获取所欲参数的平均值

--------------------

# 一、获取一个随机布尔值（true/false） #

这个函数使用 `Math.random()` 方法返回一个布尔值（true 或 false）。`Math.random` 将在 0 和 1 之间创建一个随机数，之后我们检查它是否高于或低于 0.5。这意味着得到真或假的几率是 50%/50%。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70][]

# 二、检查日期是否为工作日 #

使用这个方法，你就可以检查函数参数是工作日还是周末。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70 1][]

# 三、反转字符串 #

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70 2][]

# 四、检查是否是奇数 #

最简单的方式是通过使用模数运算符（%）来解决。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70 3][]

# 五、从日期中获取时间 #

通过使用 `toTimeString()` 方法，在正确的位置对字符串进行切片，我们可以从提供的日期中获取时间或者当前时间。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70 4][]

# 六、保留小数点（非四舍五入） #

使用 `Math.pow()` 方法，我们可以将一个数字截断到某个小数点。

const toFixed = (n, fixed) => ~~(Math.pow(10, fixed) * n) / Math.pow(10, fixed);
    // Examples
    toFixed(25.198726354, 1);       // 25.1
    toFixed(25.198726354, 2);       // 25.19
    toFixed(25.198726354, 3);       // 25.198
    toFixed(25.198726354, 4);       // 25.1987
    toFixed(25.198726354, 5);       // 25.19872
    toFixed(25.198726354, 6);       // 25.198726

# 七、检查元素是否为聚焦状态 #

我们可以使用 `document.activeElement` 属性检查一个元素当前是否处于聚焦状态。

const elementIsInFocus = (el) => (el === document.activeElement);
    elementIsInFocus(anyElement)
    // Result: will return true if in focus, false if not in focus

# 八、检查浏览器是否支持触摸事件 #

const touchSupported = () => {
      ('ontouchstart' in window || window.DocumentTouch && document instanceof window.DocumentTouch);
    }
    console.log(touchSupported());
    // Result: will return true if touch events are supported, false if not

# 九、检查当前用户是否为苹果设备 #

const isAppleDevice = /Mac|iPod|iPhone|iPad/.test(navigator.platform);
    console.log(isAppleDevice);
    // Result: will return true if user is on an Apple device

# 十、滚动到页面顶部 #

`window.scrollTo()` 方法会取一个 x 和 y 坐标来进行滚动。如果我们将这些坐标设置为零，就可以滚动到页面的顶部。

const goToTop = () => window.scrollTo(0, 0);
    goToTop();
    // Result: will scroll the browser to the top of the page

# 十一、获取所欲参数的平均值 #

const average = (...args) => args.reduce((a, b) => a + b) / args.length;
    average(1, 2, 3, 4);
    // Result: 2.5

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70]: /images/20210724/93895e6a20544a9091a57a9e0d7ff1ad.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70 1]: /images/20210724/822a117a1fd14c9e82d6e602d96906ce.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70 2]: /images/20210724/f077546738c84fbeb05d45d4e85a00be.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70 3]: /images/20210724/b59af36621f242d39b259affb210dcef.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hhcHB5ODE5OTc_size_16_color_FFFFFF_t_70 4]: /images/20210724/20321bc096cc4136b8fc6cb419390658.png