JavaScript必须学会的11个工具方法

　　计算距离下次生日还有多少天
　　注意这里借助moment实现getBirthdayFun（）｛首先要获取到今年的生日letbirthdayTimemoment（）。format（YYYY）1219通过时间戳去判断当前的时间戳是否大于今年生日的时间戳if（moment（）。unix（）moment（birthdayTime）。unix（））｛如果大于的话，那么就在今年的生日上再添加一年，已达到获取下次生日的时间birthdayTimemoment（birthdayTime）。add（1，y）。format（YYYYMMDD）｝这个直接通过计算（下次生日的时间戳当前日期的时间戳）（606024）最后求出来的就是XX天returnparseInt（（moment（birthdayTime）。unix（）moment（）。unix（））（606024））｝回到顶部这里我把vue3的案例拿过来constbindTop（）｛方法一这样可以实现，但是效果不太行window。scrollTo（0，0）document。documentElement。scrollTop0；方法二通过计时器去滚动视觉上会丝滑一些，没有太大的卡顿效果consttimeTopsetInterval（（）｛去控制他的滑行距离document。documentElement。scrollTopscrollTopH。value50当滑到顶部的时候记得清除计时器（）重点if（scrollTopH。value0）｛clearInterval（timeTop）｝｝，10）｝复制文本constcopyText（text）｛clipboardData在页面上将需要的东西复制到剪贴板上constclipboardDatawindow。clipboardDataif（clipboardData）｛clipboardData。clearData（）clipboardData。setData（Text，text）returntrue｝elseif（document。execCommand）｛注意document。execCommand已弃用但是有些浏览器依旧支持用的时候记得看兼容情况通过创建dom元素，去把要复制的内容拿到consteldocument。createElement（textarea）el。valuetextel。setAttribute（readonly，）el。style。positionabsoluteel。style。left9999pxdocument。body。appendChild（el）el。select（）拷贝当前内容到剪贴板document。execCommand（copy）删除el节点document。body。removeChild（el）returntrue｝returnfalse｝copyText（hello！）ctrlvcopyTexttrue复制代码防抖节流
　　简单介绍防抖：指定时间内频繁触发一个事件，以最后一次触发为准节流：指定时间内频繁触发一个事件，只会触发一次应用场景有很多比如：
　　防抖是：input搜索，用户在不断输入内容的时候，用防抖来减少请求的次数并且节约请求资源
　　节流：场景普遍就是按钮点击，一秒点击10下会发起10次请求，节流以后1秒点再多次，都只会触发一次
　　下面我们来实现防抖fn需要防抖的函数，delay为定时器时间functiondebounce（fn，delay）｛lettimernull用于保存定时器returnfunction（）｛如果timer存在就清除定时器，重新计时if（timer）｛clearTimeout（timeout）；｝设置定时器，规定时间后执行真实要执行的函数timeoutsetTimeout（（）｛fn。apply（this）；｝，delay）；｝｝节流functionthrottle（fn）｛lettimernull；首先设定一个变量，没有执行定时器时，默认为nullreturnfunction（）｛if（timer）return；当定时器没有执行的时候timer永远是false，后面无需执行timersetTimeout（（）｛fn。apply（this，arguments）；最后在setTimeout执行完毕后再把标记设置为true（关键）表示可以执行下一次循环了。timernull；｝，1000）；｝；｝过滤特殊字符functionfilterCharacter（str）｛首先设置一个模式letpatternnewRegExp（〔！（）：。，、？｛｝：；，〔〕。？！（）；｛｝【】‘；〕）letresultStr；for（leti0；istr。length；i）｛主要通过replace，pattern规则去把字符替换成空最后拼接在resultStrresultStrresultStrstr。substr（i，1）。replace（pattern，）；｝当循环结束的时候返回最后结果resultStrreturnresultStr；｝示例filterCharacter（gyaskjdhy12316789！1123，。〔）结果：gyaskjdhy123167891123常用正则判断校验29位文字不符合为false符合为trueconstvalidateName（name）｛constreg〔一龥〕｛2，9｝；returnreg。test（name）；｝；校验手机号constvalidatePhoneNum（mobile）｛constreg1〔3，4，5，6，7，8，9〕d｛9｝；returnreg。test（mobile）；｝；校验6到18位大小写字母数字下划线组成的密码constvalidatePassword（password）｛constreg〔azAZ09〕｛6，18｝；returnreg。test（password）；｝；初始化数组fill（）方法是es6新增的一个方法使用指定的元素填充数组，其实就是用默认内容初始化数组constarrListArray（6）。fill（）console。log（arrList）此处打印的是〔，，，，，〕将RGB转换为十六进制functiongetColorFun（r，g，b）｛return（（124）（r16）（g8）b）。toString（16）。slice（1）｝getColorFun（178，232，55）这里输出的是b2e837检测是否是一个函数检测是否是一个函数其实写法以后直接isFunction就好了，避免重复写判断constisFunction（obj）｛returntypeofobjfunctiontypeofobj。nodeType！numbertypeofobj。item！function；｝；检测是否为一个安全数组检测是否为一个安全数组，若不是返回空数组这里借助isArray方法constsafeArray（array）｛returnArray。isArray（array）？array：〔〕｝检测对象是否为一个安全对象首先要去判断当前对象是否为有效对象constisVaildObject（obj）｛returntypeofobjobject！Array。isArray（obj）Object。keys（obj）。length｝这里直接用上面的函数如果有效就返回本身，无效就返回空对象constsafeObjectobjisVaildObject（obj）？obj：｛｝
　　头条创作挑战赛