今天的文章是我从网上整理的一些常见的JavaScriptTips。我在我的项目中使用了所有这些实用技巧，今天我想与您分享它们，希望它们也能对您有所帮助。1.数字分隔符为了提高数字的可读性，可以使用下划线作为分隔符。constlargeNumber=1_000_000_000;console.log(largeNumber);//10000000002.事件监听器只运行一次如果你想添加一个事件监听器并且只运行一次，你可以使用once选项。element.addEventListener('click',()=>console.log('我只运行一次'),{once:true});3.console.log变量包装器在console.log()中，将参数用花括号括起来，这样既可以看到变量名，也可以看到变量值。constname="麦克斯韦";console.log({名称});4。检查CapsLock是否打开您可以使用KeyboardEvent.getModifierState()来检测CapsLock是否打开。constpasswordInput=document.getElementById('password');passwordInput.addEventListener('keyup',function(event){if(event.getModifierState('CapsLock')){//CapsLock已打开}});5.从数组中获取数组中的最小值/最大值您可以使用Math.min()或Math.max()和扩展运算符来查找数组中的最小值或最大值。常量数字=[5,7,1,4,9];console.log(Math.max(...numbers));//9console.log(Math.min(...numbers));//16.获取鼠标位置可以使用MouseEvent对象的clientX和clientY属性的值来获取当前鼠标位置的坐标信息。document.addEventListener('mousemove',(e)=>{console.log(`鼠标X:${e.clientX},鼠标Y:${e.clientY}`);});7.复制到剪贴板您可以使用剪贴板API创建“复制到剪贴板”功能。functioncopyToClipboard(text){navigator.clipboard.writeText(text);}8.简写条件判断语句如果函数只在条件为真时执行，可以使用&&简写。//常用写法if(condition){doSomething();}//缩写condition&&doSomething();9.console.table()以特定格式打印表格语法：console.table(data[,columns]);参数：data表示要显示的数据。它必须是一个数组或对象。columns表示包含列名称的数组。functionPerson(firstName,lastName){this.firstName=firstName;this.lastName=lastName;}constp1=newPerson("马克","史密斯");constp2=newPerson("Maxwell","Siegrist");constp3=newPerson("露西","琼斯");console.table([p1,p2,p3],["firstName"]);10.将字符串转换为数字conststr='508';console.log(+str)//508;11.数组去重constnumbers=[2,3,5,5,2];console.log([...newSet(numbers)]);//[2,3,5]12.过滤数组中的所有虚值constmyArray=[1,undefined,NaN,2,null,'@maxwell',true,5,false];console.log(myArray.filter(Boolean));//[1,2,"@maxwell",true,5]13.使用includeconstmyTech='JavaScript';consttechs=['HTML','CSS','JavaScript'];//常用写法if(myTech==='HTML'||myTech==='CSS'||myTech==='JavaScript'){//dosomething}//includeswritingmethodif(techs.includes(myTech)){//dosomething}14.广泛使用reduce对数组求和constmyArray=[10,20,30,40];constreducer=(total,currentValue)=>total+currentValue;console.log(myArray.reduce(reducer));//10015.元素的数据集使用数据集属性访问元素的自定义数据属性(data-*)
