当前位置: 首页 > 科技观察

20个有用的JavaScript技巧

时间:2023-03-18 00:48:54 科技观察

JavaScript继续发展,因为它是最容易上手的语言之一,从而为市场上新的“成为技术极客”打开了大门。(真的吗?)是的,JavaScript可以做很多很棒的事情!还有很多东西要学。而且,无论您是JavaScript新手还是更专业的开发人员,学习新东西总是好的。我将介绍一些非常有用的单行代码(超过20个奖励),它们可以帮助您提高工作效率并帮助调试代码。什么是单线?一行代码是一种代码实践,我们只用一行代码来执行某些功能。1.随机获取一个布尔值此函数将使用Math.random()方法返回一个布尔值(true或false)。Math.random创建一个介于0和1之间的随机数,然后我们检查它是大于还是小于0.5。这意味着有50/50的机会做对或做错。constgetRandomBoolean=()=>Math.random()>=0.5;console.log(getRandomBoolean());//返回true或false的概率为50/502.检查日期是否为周末使用此函数您将能够检查提供的日期是工作日还是周末。constisWeekend=(date)=>[0,6].indexOf(date.getDay())!==-1;console.log(isWeekend(newDate(2021,4,14)));//假(星期五)console.log(isWeekend(newDate(2021,4,15)));//true(Saturday)3.检查数字是偶数还是奇数简单的实用函数来检查数字是偶数还是奇数。constisEven=(num)=>num%2===0;console.log(isEven(5));//falseconsole.log(isEven(4));//true4.从数组中获取数组中的唯一值非常简单的方法去除所有重复值。此函数将数组转换为Set并返回一个数组。constuniqueArr=(arr)=>[...newSet(arr)];console.log(uniqueArr([1,2,3,1,2,3,4,5]));//[1,2,3,4,5]5.检查变量是否为数组Aclean以及检查变量是否为数组的简单方法。好吧,也可以有其他方法:constisArray=(arr)=>Array.isArray(arr);console.log(isArray([1,2,3]));//trueconsole.log(isArray({name:'Ovi'}));//falseconsole.log(isArray('HelloWorld'));//false6.在两个数字之间生成一个随机数这将以两个数字为参数,并将在两个数字之间生成一个随机数!constrandom=(min,max)=>数学。floor(Math.random()*(max-min+1)+min);安慰。日志(随机(1、50));//可以是1-507之间的任何值。生成随机字符串(唯一ID?)也许你需要为某些东西创建一个临时的唯一ID,这里有一个技巧你可以用来生成随机字符串。constrandomString=()=>Math.random().toString(36).slice(2);console.log(randomString());//可以是任何东西!!!8.在窗口中滚动到页面顶部。scrollTo()方法采用要滚动到的X和Y坐标。如果将它们设置为零和零,它将滚动到页面顶部。constscrollToTop=()=>window.scrollTo(0,0);滚动到顶部();9.切换布尔值切换布尔值是最基本的编程问题之一,可以通过许多不同的方式解决。您可以使用带*!翻转当前值。*“非”运算符。//bool存储在upperscope的某个地方consttoggleBool=()=>(bool=!bool);10.交换两个变量下面的代码是不使用第三个变量而仅使用一行代码来交换两个变量的更好的简便方法之一。[foo,bar]=[bar,foo];11.计算两个日期之间的天数要计算两个日期之间的天数,我们先求出两个日期之间的绝对值除以86400000(等于一天中的毫秒数),最后对结果进行四舍五入并归还它。constdaysDiff=(date,date2)=>Math.ceil(Math.abs(date-date2)/86400000);console.log(daysDiff(新日期('2021-05-10'),新日期('2021-11-25')));//19912.将文本复制到剪贴板PS:您可能需要添加检查以查看navigator.clipboard.writeText是否存在:constcopyTextToClipboard=async(text)=>{awaitnavigator.clipboard.写文本(文本);};13。组合多个数组的不同方法有两种组合数组的方法。其中之一是使用“concat”方法。另一种是使用扩展运算符(“...”)。PS:我们还可以使用“设置”对象从最终数组中复制任何内容。//合并但不删除重复constmerge=(a,b)=>a.concat(b);//Orconstmerge=(a,b)=>[...a,...b];//合并并删除重复项constmerge=[...newSet(a.concat(b))];//Orconstmerge=[...newSet([...a,...b])];14.获取javascript原语的实际类型人们有时会使用库来查找JavaScript中某些东西的实际类型,这个小技巧可以节省您的时间(和代码大小)。consttrueTypeOf=(obj)=>{returnObject.prototype.toString.call(obj).slice(8,-1).toLowerCase();};console.log(trueTypeOf(''));//字符串控制台。log(trueTypeOf(0));//numberconsole.log(trueTypeOf());//undefinedconsole.log(trueTypeOf(null));//nullconsole.log(trueTypeOf({}));//objectconsole.log(trueTypeOf([]));//arrayconsole.log(trueTypeOf(0));//numberconsole.log(trueTypeOf(()=>{}));//function15.在末尾截断字符串需要从开头截断字符串,这不是问题!consttruncateString=(string,length)=>{returnstring.length{return`${string.切片(0,开始)}...${字符串。切片(字符串。长度-结束)}`;};安慰。log(truncateStringMiddle('长话短说到此结束!',//字符串25,//总长度需要13,//从开始保留的字符17,//从结束开始保留的字符),);//说来话长……终于结束了!17.将字符串大写不幸的是,JavaScript没有内置的函数来将字符串大写,但是这个解决方法可以帮助您实现您的目标。constcapitalize=(str)=>str.charAt(0).toUpperCase()+str.slice(1);console.log(capitalize('helloworld'));//Helloworld18。检查当前选项卡是否在视图/焦点中这个简单的辅助方法根据选项卡是否在视图/焦点中返回true或false:constisTabInView=()=>!document.hidden;//不隐藏disTabInView();//真/假19。检查用户是否在苹果设备上(做兼容时判断设备系统)。如果用户使用的是Apple设备,则返回true:constisAppleDevice=()=>/Mac|iPod|iPhone|iPad/.test(navigator.platform);console.log(isAppleDevice);//true/false20.三元运算符当您只想在一行中编写if..else语句时,这是一个很好的代码节省器。//Longhandconstage=18;letgreetings;if(age<18){greetings='你还不够大';}else{greetings='你还年轻!';}//Shorthandconstgreetings=age<18?'你还不够大':'你还年轻!';奖励-短路求值速记将一个变量值赋给另一个变量时,您可能需要确保源变量不为null、undefined或空。您可以编写包含多个条件的长if语句,也可以使用短路评估。//Longhandif(name!==null||name!==undefined||name!==''){letfullName=name;}//ShorthandconstfullName=name||'伙伴';原文链接:20JavaScriptOneLinesThatWillHelpYouCodelikeaPro