翻译自 10 super useful tricks for javascript developers，作者 mahdhi rezvi。
我们知道，javascript 这门语言正在高速发展中。伴随着 es2020，又有很多很棒的功能加入。老实说，您可以通过许多不同的方式编写代码。实现同样一个功能，有的代码很长而有的却很短。你可以通过一些小技巧来让你的代码更干净清晰。下面这些小技巧肯定对你接下来的开发工作有所用处。
函数参数验证器javascript 允许你对函数参数设置默认值。通过这个特性，我们可以实现一个小技巧来验证函数参数。
const isrequired = () => { throw new error('param is required'); };const print = (num = isrequired()) => { console.log(`printing ${num}`) };print(2); //printing 2print(); // errorprint(null); //printing null
格式化 json 代码你肯定对 json.stringify 非常熟悉了，但是你知道吗，你也可以通过 stringify 方法格式化你的代码。其实这很简单。
stringify 方法有三个参数，分别是 value replacer 和 space。后面两个参数是可选的，所以我们平常也不会用到它们。想要缩进输出的代码，我们可以使用2个空格 ，或者4个空格。
console.log(json.stringify({ name:john, age:23 }, null, ' '));>>> { name: john, age: 23}
对数组去重以往对数组去重我们会使用 filter 函数来过滤掉重复的值。但是现在我们可以使用新的 set 特性来过滤。非常简单：
let uniquearray = [...new set([1, 2, 3, 3, 3, school, school, 'ball', false, false, true, true])];>>> [1, 2, 3, school, ball, false, true]
去除数组中的 boolean(v) 为 false 的值有时候你想删除数组中 boolean(v) 为 false 的值。在 javascript 中只有以下 6 种：
undefinednullnan0空字符串false去除这些值最简单的办法是使用下面的方法：
array.filter(boolean)
如果你想先做一些更改然后再过滤，你可以用下面的方法。要记住，原始数组 array 是一直没变的，返回的是一个新数组。
array .map(item => { // do your changes and return the new item }) .filter(boolean);复制代码
同时合并多个对象如果需要同时合并多个对象或者类，可以用下面这种方法。
const user = { name: john ludwig, gender: male,};const college = { primary: mani primary school, secondary: lass secondary school,};const skills = { programming: extreme, swimming: average, sleeping: pro,};const summary = { ...user, ...college, ...skills };>>>{ name: 'john ludwig', gender: 'male', primary: 'mani primary school', secondary: 'lass secondary school', programming: 'extreme', swimming: 'average', sleeping: 'pro'}
三个点也叫扩展操作符。
对数字数组排序javascript 数组有一个原生的排序方法 arr.sort。 这个排序方法默认把数组元素转换成字符串，并对其进行字典序排序。这个默认行为会在排序数字数组时出现问题，所以下面有一个办法来处理这个问题。
[0, 10, 4, 9, 123, 54, 1].sort()>>> [0, 1, 10, 123, 4, 54, 9][0, 10, 4, 9, 123, 54, 1].sort((a,b) => a-b);>>> [0, 1, 4, 9, 10, 54, 123]
禁用右键有时候你可能想要禁止用户点击右键。虽然这个需求很少见，但是可能派的上用场。
<body oncontextmenu="return false"> <div></div></body>
这个简单的代码片段就可以禁止用户点击右键了。
解构时重命名解构赋值是 javascript 的一个特性，它允许直接从数组或者对象中获取值，而不需要繁琐的声明变量再赋值。对对象来讲，我们可以通过下面这种方式来给属性名重新定义一个名字。
const object = { number: 10 };// grabbing numberconst { number } = object;// grabbing number and renaming it as othernumberconst { number: othernumber } = object;console.log(othernumber); // 10
获取数组中的最后一项如果你想获取数组中的最后一项，你可以使用 slice 函数，同时带上一个负数作为参数。
let array = [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]
等待 promises 全部执行完成有时候你可能需要等待几个 promise 都执行完然后进行后面的操作。你可以使用 promise.all 来并行执行这些 promise。
const promisearray = [ promise.resolve(100), promise.reject(null), promise.resolve(data release), promise.reject(new error('something went wrong'))];promise.all(promisearray) .then(data => console.log('all resolved! here are the resolve values:', data)) .catch(err => console.log('got rejected! reason:', err))
要注意，只要 promise.all 中有一个是 rejected 状态时，其会立即停止执行并抛出异常。
如果你想忽略 resolved 或者 rejected 状态，你可以使用 promise.allsettled。这个是 es2020 的一个新特性。
const promisearray = [ promise.resolve(100), promise.reject(null), promise.resolve(data release), promise.reject(new error(something went wrong)),];promise.allsettled(promisearray) .then((res) => { console.log(here, res); }) .catch((err) => console.log(err));>>>here [ { status: 'fulfilled', value: 100 }, { status: 'rejected', reason: null }, { status: 'fulfilled', value: 'data release' }, { status: 'rejected', reason: error: something went wrong at object.<anonymous> at module._compile (internal/modules/cjs/loader.js:1200:30) at object.module._extensions..js (internal/modules/cjs/loader.js:1220:10) at module.load (internal/modules/cjs/loader.js:1049:32) at function.module._load (internal/modules/cjs/loader.js:937:14) at function.executeuserentrypoint [as runmain] (internal/modules/run_main.js:71:12) at internal/main/run_main_module.js:17:47 }]
推荐教程：《js教程》
以上就是对javascript开发者非常有用的10个奇淫巧计的详细内容。