7个有用的JavaScript技巧

就像所有其他编程语言一样，JavaScript具有许多技巧来完成简单和困难的任务。有些技巧众所周知，而另一些技巧足以使您震惊。让我们来看看您今天可以开始使用的七个JavaScript技巧！

获取数组的唯一值

获取唯一值数组可能比您想象的要容易：

var j = [...new Set([1, 2, 3, 3])] >> [1, 2, 3]

我喜欢rest表达和Set的混合!

数组和布尔

是否需要从数组中过滤假值(0，未定义，null, false等)?你可能不知道这个技巧:

myArray     .map(item => {         // ...     })     // Get rid of bad values     .filter(Boolean);

只要传递布尔值，所有的假值都消失!

创建空对象

当然，你可以用{}创建一个看起来是空的对象，但该对象仍然有__proto__和通常的hasOwnProperty和其他对象方法。然而，有一种方法可以创建一个纯“dictionary”对象:

let dict = Object.create(null); // dict.__proto__ === "undefined" // No object properties exist until you add them

对象上没有任何键或方法是你不放进去的!

合并对象

在JavaScript中合并多个对象的需求一直存在，特别是当我们开始创建带有选项的类和小部件时:

const person = { name: 'David Walsh', gender: 'Male' }; const tools = { computer: 'Mac', editor: 'Atom' }; const attributes = { handsomeness: 'Extreme', hair: 'Brown', eyes: 'Blue' }; const summary = {...person, ...tools, ...attributes}; /* Object {   "computer": "Mac",   "editor": "Atom",   "eyes": "Blue",   "gender": "Male",   "hair": "Brown",   "handsomeness": "Extreme",   "name": "David Walsh", } */

这三个点让任务变得简单多了!

需要函数参数

能够为函数参数设置默认值对JavaScript来说是一个很棒的附加功能，但是看看这个技巧，它要求为给定的参数传递值:

const isRequired = () => { throw new Error('param is required'); }; const hello = (name = isRequired()) => { console.log(`hello ${name}`) }; // This will throw an error because no name is provided hello(); // This will also throw an error hello(undefined); // These are good! hello(null); hello('David');

这是下一个级别的验证和JavaScript使用!

解构的别名

对JavaScript来说，解构是一个非常受欢迎的附加功能，但有时我们更喜欢用另一个名字来引用这些属性，这样我们就可以利用别名:

const obj = { x: 1 }; // Grabs obj.x as { x } const { x } = obj; // Grabs obj.x as { otherName } const { x: otherName } = obj;

获取查询字符串参数

多年来，我们编写了大量的正则表达式来获取查询字符串值，但这些日子已经一去不复返了——输入令人惊叹的URLSearchParams API:

// Assuming "?post=1234&action=edit" var urlParams = new URLSearchParams_(window.location.search); console.log(urlParams.has('post')); // true console.log(urlParams.get('action')); // "edit" console.log(urlParams.getAll('action')); // ["edit"] console.log(urlParams.toString()); // "?post=1234&action=edit" console.log(urlParams.append('active', '1')); // "?post=1234&action=edit&active=1"

比我们以前编写容易多了!

这些年来JavaScript已经发生了很大的变化，但我最喜欢的部分是这些天来我们所看到的语言改进的速度。尽管JavaScript的动态变化不断，我们仍然需要使用一些不错的技巧;把这些技巧放在你的工具箱里，以备不时之需!

你最喜欢的JavaScript技巧是什么?