55个JS代码让你轻松当大神
本文从简单到复杂列出了前端常用的一些代码段。善用这些代码可以让你的代码更高雅，别人更难懂。你就是公司的护城河，你就是前端的顶梁柱。
- 数组平铺。这是一个很实用的让复杂的数组快速变成一个常用数组的技巧。arr参数不管是一维数组还是多维数组，经过转变之后最终都会变成一维数组。
- 手动延时xx毫秒。在异步请求编程中，有时候要用到让进程等待的情况，用这个函数可以设定等待多少毫秒。
- 把数组内容随便换个位置。可以用来生成随机位置的内容，比如洗牌这种场景。
- 数组去重。原理就是先转成Set对象，自动去掉重复的部分，再转回数组。
- 一键给网页上边框。常用于调试的时候，看一下DOM的框是不是自己要的，其中颜色是随机生成的。也可以自己改一下变成固定颜色的边框。
效果如下：
6. 一键查看密码。同理也可以自己修改，这里用代码的方式来查看。原理是input框虽然是type=password的，但是内容并没有加密，只要换成text就会正常显示。
- 一键去掉鼠标的图标，让人摸不着头脑的操作。一般用于防止别人调试自己的网页。
- 检查一个日期是否是在周末。常用于判断当前日期是否是周末，一般场景下还会叠加一个判断是否节假日。
- 检查一个日期是否在某个年份内。通过获取参数日期的年和需要比较的日期的年来进行比较。如果年的参数比较规范，可以不转一次Date对象，直接比较即可。
- 检查日期是否是一个有效日期。原理是用参数来创建日期，看日期是否有效。
- 计算两个日期之间的时间间隔。这里计算的是天，也可以自己改成其他的。
- 获取日期从年初到现在入参有多少天。入参是Date对象，通过比较获得时间差，默认是毫秒。这里除以一天的毫秒数获得了天数。
- 返回日期的时间部分，并设置格式为hh:mm:ss的形式。
- 把字符串的首字母大写。有时候网页展示的时候会用得到。
- 字符串反转。一般没啥用，看看就行。以前面试的时候会用的到。
- 生成随机字符串，各种随机基本都是这个原理。
- 按照参数阶段字符串的长度，如果长度不够就不截取。一般代码中自己写也行，但是要多写一个逻辑判断。
- 删除字符串中的HTML内容。一般情况下用来防止富文本内容中注入了js代码、去掉不需要的内容等。
- 判断一个数组是否为空。这里一方面是判断是否为数组，另一方面是判断数组内容。
- 数组合并，两个数组合并成一个数组。下面是两种方法，都有用，只是用到的语法不同。
- 判断数字是奇数还是偶数，同理还可以判断是否可以被3整除之类的。
- 计算一组数字的平均值。具体就是所有数字相加再被数量除一次。
- 获得一个随机数。第一个是从0开始到数字之间，第二个是两个数字之间。注意最后的加法是独立算数，修改的时候别改错地方了。
- 按照指定位数四舍五入。如果没有要求，第二种也是很好用的。
- 获取一个随机颜色。
- 使用浏览器的原生API复制内容到剪贴板。有的浏览器可能有兼容问题。
- 清除Cookie。老方法了，可以挨个清除cookie的内容。
- 使用浏览器原生的API获得用户框选的文本内容。
- 检查当前环境是否黑暗模式。CSS的检查也是这个原理。
30.让页面返回浏览器顶部。
- 检测当前标签页是否处于激活模式。
- 检测当前设备是否苹果设备。同理还有微信浏览器、支付宝浏览器等。
- 判断当前页面是否在底部了。
- 打开浏览器的打印模式。
- 检测一个对象是否为空。
- 前端自己生成18位的UUID。用到的时候就用到了，一般情况下用不到，哈哈。
- RGB形式的颜色转成16进制的颜色。
- HEX形式的颜色转RGB形式的颜色。
- 网易音乐的web端启用下载功能（标准音质）。
- 前端自己计算内容的SHA256值。
- 浅拷贝。简单使用场景下的方式。
- 深拷贝。多层级下的内容都可以处理到。function不行，那个要单独处理。
- 自己实现一个单向链表。面试的时候会用到，一般情况下有这个思维就可以了。
- 自定义方式的数组排序。
- useMap。实现一个自动处理Map对象的hook。
- useSet。实现一个自动处理内部数据的Set对象。
- useDefault。有内容使用设置的内容，没有内容使用默认的内容。
- useMergeState。实现一个合并内容的对象，常见对象的自动更新。
- useDebounce。实现一个React的防抖。
- useForm。实现一个React的Form对象，自动管理Form内容。
- useEventListener。实现一个自动监听函数，可以监听鼠标移动。
- useKeyPress。实现一个键盘对应的键的事件监听函数。
- useHover。实现一个鼠标悬停事件的监听函数。
- useRequestAnimationFrame。实现一个RequestAnimationFrame函数在React中使用的方法。
- useBodyScrollLock。实现一个自动锁定滚动条的函数。一般弹窗会用的上。
JavaScript常用API合集汇总「值得收藏」
作者：JavaScript
转发链接：https://www.kancloud.cn/dennis/tgjavascript/241852
今天这篇文章跟大家分享一些JavaScript常用的API代码，有DOM操作、CSS操作、对象（Object对象、Array对象、Number对象、String对象、Math对象、JSON对象和Console对象）操作，值得收藏。
对象实例的方法
（1）生成实例对象
（2）String对象的属性
（3）方法
（1）属性
（2）数学方法
（3）三角函数方法
（1）方法
（1）方法
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
《》
作者：JavaScript
转发链接：https://www.kancloud.cn/dennis/tgjavascript/241852
本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com
文章为作者独立观点不代本网立场，未经允许不得转载。
投诉举报&联系我们：
