点击上方前端瓶子君,关注公众号
回复算法,加入前端编程面试算法每日一题群
8个工程必备的JavaScript代码片段,听过这样起博客标题可以提高阅读量。????
最近写博客好累,让8月征文活动搞的,今天水一篇好了,麻烦不要给我点赞,不想看到消息通知的小红点。
1. 获取文件后缀名
使用场景:上传文件判断后缀名
/***获取文件后缀名*@param{String}filename*/exportfunctiongetExt(filename){if(typeoffilename=='string'){returnfilename.split('.').pop().toLowerCase()}else{thrownewError('filenamemustbeastringtype')}}复制代码
使用方式
getExt("1.mp4")//->mp4复制代码
2. 复制内容到剪贴板
exportfunctioncopyToBoard(value){constelement=document.createElement('textarea')document.body.appendChild(element)element.value=valueelement.select()if(document.execCommand('copy')){document.execCommand('copy')document.body.removeChild(element)returntrue}document.body.removeChild(element)returnfalse}复制代码
使用方式:
//如果复制成功返回truecopyToBoard('lalallala')复制代码
原理:
创建一个textare元素并调用select()方法选中
document.execCommand('copy')方法,拷贝当前选中内容到剪贴板。
3. 休眠多少毫秒
/***休眠xxxms*@param{Number}milliseconds*/exportfunctionsleep(ms){returnnewPromise(resolve=>setTimeout(resolve,ms))}//使用方式constfetchData=async()=>{awaitsleep(1000)}复制代码
4. 生成随机字符串
/***生成随机id*@param{*}length*@param{*}chars*/exportfunctionuuid(length,chars){chars=chars||'0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'length=length||8varresult=''for(vari=length;i>0;--i)result+=chars[Math.floor(Math.random()*chars.length)]returnresult}复制代码
使用方式
//第一个参数指定位数,第二个字符串指定字符,都是可选参数,如果都不传,默认生成8位uuid()复制代码
使用场景:用于前端生成随机的ID,毕竟现在的Vue和React都需要绑定key
5. 简单的深拷贝
/***深拷贝*@export*@param{*}obj*@returns*/exportfunctiondeepCopy(obj){if(typeofobj!='object'){returnobj}if(obj==null){returnobj}returnJSON.parse(JSON.stringify(obj))}复制代码
缺陷:只拷贝对象、数组以及对象数组,对于大部分场景已经足够
constperson={name:'xiaoming',child:{name:'Jack'}}deepCopy(person)//newperson复制代码
6. 数组去重
/***数组去重*@param{*}arr*/exportfunctionuniqueArray(arr){if(!Array.isArray(arr)){thrownewError('Thefirstparametermustbeanarray')}if(arr.length==1){returnarr}return[...newSet(arr)]}复制代码
原理是利用Set中不能出现重复元素的特性
uniqueArray([1,1,1,1,1])//[1]复制代码
7. 对象转化为FormData对象
/***对象转化为formdata*@param{Object}object*/exportfunctiongetFormData(object){constformData=newFormData()Object.keys(object).forEach(key=>{constvalue=object[key]if(Array.isArray(value)){value.forEach((subValue,i)=>formData.append(key+`[${i}]`,subValue))}else{formData.append(key,object[key])}})returnformData}复制代码
使用场景:上传文件时我们要新建一个FormData对象,然后有多少个参数就append多少次,使用该函数可以简化逻辑
使用方式:
letreq={file:xxx,userId:1,phone:'15198763636',//...}fetch(getFormData(req))复制代码
8.保留到小数点以后n位
//保留小数点以后几位,默认2位exportfunctioncutNumber(number,no=2){if(typeofnumber!='number'){number=Number(number)}returnNumber(number.toFixed(no))}复制代码
使用场景:JS的浮点数超长,有时候页面显示时需要保留2位小数
关于本文
来源:_红领巾
/post/6999391770672889893
最后
欢迎关注【前端瓶子君】✿✿ヽ(°▽°)ノ✿
回复「算法」,加入前端编程源码算法群,每日一道面试题(工作日),第二天瓶子君都会很认真的解答哟!
回复「交流」,吹吹水、聊聊技术、吐吐槽!
回复「阅读」,每日刷刷高质量好文!
如果这篇文章对你有帮助,「在看」是最大的支持
》》面试官也在看的算法资料《《
“在看和转发”就是最大的支持