这几行 JavaScript 代码让你看起来更像高手

2021-12-30  本文已影响0人  酷酷的凯先生

页面滚动到顶部

window.scrollTo() 会滚动至指定的坐标,如果设置坐标为(0,0),就会回到页面顶部。window.scrollTo() 函数参数也接收是一个对象,如{ top: 0, left: 0, behavior: "smooth" } 即可平滑的滚动至指定坐标。

// 普通滚动
const goToTop = () => window.scrollTo(0, 0);
goToTop();      

 //平滑滚动
const goToTopBehavior = () => window.scrollTo({
    top: 0, 
    left: 0,
    behavior: "smooth" 
});
goToTopBehavior (); 

检查元素是否处于聚焦状态

const isTouch = () => {
  ('ontouchstart' in window || window.DocumentTouch && document instanceof window.DocumentTouch);
}
console.log(isTouch ()); // 持触摸事件 true,否则为 false

检查元素是否处于聚焦状态

const isFocus = (el) => (el === document.activeElement);
isFocus (element); // 处于焦点状态 true,否则为 False

保留指定的小数位

原理:利用幂函数Math.pow()来解决 JS 操作数字的精度问题,以及使用~~将变量转换为数字。
注意:没有四舍五入

const numToFixed = (n, fixed) => ~~(Math.pow(10, fixed) * n) / Math.pow(10, fixed);
numToFixed (123.13579, 1);       // 123.1
numToFixed (123.13579, 2);       // 123.13
numToFixed (123.13579, 3);       // 123.135
numToFixed (123.13579, 4);       // 123.1357

获取随机布尔值(True/False)

原理:使用 Math.random() 会返回 01 的随机数,之后判断它是否大于 0.5,将会得到一个 50% 概率为 TrueFalse 的值。

const randomBool = () => Math.random() >= 0.5;
console.log(randomBool());

判断一个日期是否是工作日

原理:getDay() 返回值为:0(星期天)~ 6(星期六),所以getDay() % 60 即非工作日,反之为工作日。

const isWeekday = (date) => date.getDay() % 6 !== 0;
console.log(isWeekday(new Date(2021, 11, 24))); // true  : 周五
console.log(isWeekday(new Date(2021, 11, 25))); // false : 周六
上一篇 下一篇

猜你喜欢

热点阅读