JavaScript是一门非常复杂的语言，很多新手在使用它开发应用程序时，会发现很多功能不知所措。有了我根据功能总结的36个JavaScript技巧，一键复制粘贴！助您提高开发效率，快速解决问题，早下班，早抓鱼！DOM相关1.检查一个元素是否被聚焦consthasFocus=el=>el===document.activeElement2。获取一个元素的所有兄弟元素consta=el=>[].slice.call(el.parentNode.children).filter(child=>child!==el)3.获取当前选中的文本constgetSelectedText=()=>window.getSelection().toString()4.返回上一页constgoBack=()=>history.go(-1)5.获取所有cookie并将它们转换为对象constgetCookies=()=>document.cookie.split(';').map(item=>item.split('=')).reduce((acc,[k,v])=>(acc[k.trim().replace('"','')]=v)&&acc,{})6.清除所有cookiesconstclearCookies=()=>document.cookie.split(';').forEach(c=>document.cookie=c.splace(/^+/,'').replace(/=.*/,`=;expires=${newDate().toUTCString()};path=/`)))7.将URL参数转换为对象constgetUrlParams=(query)=>Array.from(newURLSearchParams(query)).reduce((p,[k,v])=>Object.assign({},p,{[k]:p[k]?(Array.isArray(p[k])?p[k]:[p[k]]).con猫(v):v}),{});8、检测是否为深色模式constisDarkMode=window.matchMedia&&window.matchMedia('(prefers-color-scheme:dark)').matches;数组相关9.比较两个数组constisEqual=(a,b)=>JSON.stringify(a)===JSON.stringify(b);10.将数组转换为对象constarrayToObject=(arr,key)=>arr.reduce((a,b)=>({...a,[b[key]]:b}),{});11.根据属性对数组进行计数constcountBy=(arr,prop)=>arr.reduce((prev,curr)=>((prev[curr[prop]]=++prev[curr[prop]]||1),上一个),{});12.判断数组是否为空constarrayIsNotEmpty=(arr)=>Array.isArray(arr)&&Object.keys(arr).length>0;13.展开多维数组constflat_entries=arr=>[].concat(...arr);14.获取数组最后一个元素constlastItem=arr=>arr.slice(-1)[0]对象相关15.检查多个对象是否相等constisEqual=(...objects)=>objects.every((obj)=>JSON.stringify(obj)===JSON.stringify(objects[0]));16.从对象数组中提取属性值constpluck=(objs,property)=>objs.map((obj)=>obj[property]);17.反转对象的键值constinvert=(obj)=>Object.keys(obj).reduce((res,k)=>Object.assign(res,{[obj[k]]:k}),{});18.从对象中删除null和未定义的属性constremoveNullAndUndefined=(obj)=>Object.entries(obj).reduce((a,[k,v])=>(v==null?a:((a[k]=v),a)),{});19.根据对象的属性对对象进行排序constsort=(obj)=>Object.keys(obj).sort().reduce((p,c)=>((p[c]=obj[c]),p),{});20.检查对象是否为数组constisArray=(obj)=>Array.isArray(obj);21.检查对象是否是PromiseconstisPromise=(obj)=>!!obj&&(typeofobj==='object'||typeofobj==='function')&&typeofobj.then==='功能';22.交换两个对象constexchange=(a,b)=>[a,b]=[b,a]stringrelative23.检查路径是否是相对的constisRelative=(path)=>!/^([az]+:)?[\\/]/i.test(路径);24.将字符串的第一个字符小写constlowercaseFirst=(str)=>`${str.charAt(0).toLowerCase()}${str.slice(1)}`;25.重复一个字符Stringconstrepeat=(str,numberOfTimes)=>str.repeat(numberOfTimes);26.生成IP地址constrandomIp=()=>Array(4).fill(0).map((_,i)=>Math.floor(Math.random()*255)+(i===0?1:0)).join('.');27.生成十六进制颜色字符串constrandomColor=()=>`#${Math.random().toString(16).slice(2,8).padEnd(6,'0')}`;28.生成rgb颜色字符串constrandomRgbColor=()=>`rgb(${Math.floor(Math.random()*255)},${Math.floor(Math.random()*255)},${Math.floor(Math.random()*255)})`29.underscoretohumpcaseconsttoHump=str=>str.replace(/\_(\w)/g,(all,letter)=>letter.toUpperCase());30.驼峰转下划线横线consttoLine=str=>str.replace(/([A-Z])/g,"_$1").toLowerCase()31.检查字符串是否为十六进制颜色constisHexColor=(color)=>/^#([0-9A-F]{3}|[0-9A-F]{4}|[0-9A-F]{6}|[0-9A-F]{8})$/i.test(颜色);32.RGB字符串转十六进制字符串constrgbToHex=(r,g,b)=>"#"+((1<<24)+(r<<16)+(g<<8)+b).toString(16).切片(1);daterelated33.两个日期之间的天数constdiffDays=(date,otherDate)=>Math.ceil(Math.abs(date-otherDate)/(1000*60*60*24));34.检查日期是否有效constisDateValid=(...val)=>!Number.isNaN(newDate(...val).valueOf());Others35.检测代码是否在Node.js环境下constisNode=typeofprocess!=='undefined'&&process.versions!=null&&process.versions.node!=null;36.检测代码是否在浏览器环境下constisBrowser=typeofwindow==='object'&&typeofdocument==='object';作者：代码与野兽链接：https://juejin.cn/post/7132019982644772901来源：稀土掘金版权所有商业转载请联系作者授权。非商业转载请注明出处。
