周末学到的10个超级有用的Javascript技巧！

JavaScript一直在快速变化。在新的ES2020中，有很多很棒的功能，其中大部分我们都迫不及待想要尝试。说实话，有时候我们可以从不同的角度写代码，达到同样的效果，有的会更短更清晰。下面列出了一些有用的JavaScript技巧，相信有一天它会对你有所帮助。1、方法参数验证在ES6中，可以为函数参数设置默认值。有了这个，我们可以实现一个聪明的技巧来验证方法参数不能为空。constisRequired=()=>{thrownewError('paramisrequired')}constprint=(num=isRequired())=>{console.log(`printing${num}`)}print(2)//printing2print()//errorprint(null)//printingnull2.格式化JSON代码我们都非常熟悉JSON.stringify，但鲜为人知的是它还可以格式化输出。stringify方法具有三个参数：value、replacer和space。其中，后两者是可选参数，这也是我们很少知道的原因。要缩进JSON，必须使用空格参数。console.log(JSON.stringify({name:"John",Age:23},null,'\t'));>>>{"name":"John","Age":23}3.来自从数组中获取唯一值要从数组中获取唯一值，需要使用filter方法过滤掉重复值。但是有了新的Setnativeobject，事情就变得很简单了。letuniqueArray=[...newSet([1,2,3,3,3,"school","school",'ball',false,false,true,true])];>>>[1,2,3,"school","ball",false,true]4.从数组中去除假值在某些情况下，我们希望从数组中去除假值。假值是在JavaScript中具有FALSE值的值。JavaScript中只有六个假值，它们是：undefinednullNaN0''(nullcharacter)false过滤这些假值最简单的方法是使用下面的函数：myArray.filter(Boolean)如果你想对数组做一些修改，然后过滤新的数组，你可以尝试这样的事情。请记住，原始的myArray保持不变。myArray.map(item=>{//Doyourchangesandreturnthenewitem}).filter(Boolean);5.合并多个对象在实际需求中，我们经常需要合并多个比较。一个快速的方法可以做如下：'Average',sleeping:'Pro'}constsummary={...user,...college,...skills}6.对数字数组排序JavaScript数组有一个内置的排序方法。默认情况下，此排序方法将数组元素转换为字符串并按字典顺序对它们进行排序。但是这会在对数字数组进行排序时产生问题。解决办法是手写一个排序方法。[0,10,4,9,123,54,1].sort((a,b)=>a-b)>>>[0,1,4,9,10,54,123]7。在某些情况下禁用鼠标右键，我们如果想在网页上禁用鼠标右键，可以使用下面的方法来禁用：

这个简单的代码可以禁用右键单击。8.在解构中使用别名解构赋值是一种JavaScript表达式，将数组中的值或对象中的属性解构为不同的变量。我们可以根据自己的喜好重命名它们，而不是使用现有的对象变量。constobject={number:10}const{number}=object//使用别名const{number:otherNumber}=objectconsole.log(otherNumber)//109.获取数组的最后一项如果想获取数组的最后一个元素，可以使用slice方法。letarray=[0,1,2,3,4,5,6,7]console.log(array.slice(-1))>>>[7]console.log(array.slice(-2))>>>[6,7]console.log(array.slice(-3))>>>[5,6,7]10。等待Promise在某些情况下，我们需要等待多个Promise结束。在这里，我们使用Promise.all。constPromiseArray=[Promise.resolve(100),Promise.reject(null),Promise.resolve("Datarelease"),Promise.reject(newError('Somethingwentwrong'))];Promise.all(PromiseArray).then(数据=>console.log('allresolved!hereareatheresolvevalues:',data)).catch(err=>console.log('gotrejected!reason:',err))关于Promise.all需要注意的一件事是当一个PromiseOnrejection，该方法会引发错误。这意味着我们的代码不会等到所有的Promise都完成。如果你想等到所有的Promise都resolve，不管它们是rejected还是successed，你可以使用Promise.allSettled。这个方法在ES2020的最终版本中。constPromiseArray=[Promise.resolve(100),Promise.reject(null),Promise.resolve("Datarelease"),Promise.reject(newError('Somethingwentwrong'))];Promise.allSettled(PromiseArray).然后(res=>{console.log(res);}).catch(err=>console.log(err));//[//{status:"fulfilled",value:100},//{status:"rejected",reason:null},//{status:"fulfilled",value:"Datarelease"},//{status:"rejected",reason:Error:Somethingwentwrong...}//]作者：MahdhiRezvi译者：Front-end小智来源：medium原文：https://blog.bitsrc.io/10-super-useful-tricks-for-javascript-developers-f1b76691199b二维码关注。转载请联系大千世界公众号。