💜 👝 👩🏼‍🤝‍👨🏾 JavaScript：7个有用的小东西 🙆 🕣 🐡

该注释的作者（我们今天将要翻译的译本）说，与其他任何编程语言一样，在JavaScript中，您可以找到许多旨在解决各种问题的小技巧，这些问题既简单又非常复杂。这些技术中的一些广为人知，而其他不那么普遍的技术可能会使那些不了解这些技术的人感到惊喜。现在，我们将研究7种有用的JavaScript编程技术。

1.获取唯一的数组值

在JavaScript中，从另一个数组生成仅包含唯一值的数组可能比您想象的要容易：

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

我喜欢通过使用operator ...和Set数据类型来解决此问题的方式。

2.数组和逻辑值

您是否曾经需要从转换为逻辑类型为false 的数组中删除值？例如，这些值是0 ， undefined ， null ， false 。您可能不知道要执行此操作，可以这样做：

 myArray   .map(item => {       // ...   })   //       .filter(Boolean);

如您所见，为了摆脱所有这些值，只需将Boolean值传递给.filter()数组方法即可。

3.创建真正的空对象

我确信您可以使用对象文字{}的语法创建一个看起来空的对象。但是原型（ __proto__ ）将被分配给这样的对象，它将具有hasOwnProperty()方法和其他对象方法。为了创建一个真正的空对象（例如可以用作“字典”），可以执行以下操作：

 let dict = Object.create(null); // dict.__proto__ === "undefined" //        ,

以这种方式创建的对象没有程序员未添加的属性和方法。

4.合并对象

那些用JavaScript编写的人总是需要创建这样的对象，其中包括其他对象的内容。当类出现在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", } */

操作员...大大简化了合并对象任务的解决方案。

5.所需功能参数

设置默认函数参数值是对JavaScript的很好扩展。但是这是如何做到这一点，以便在不传递某些必需参数的情况下，函数将简单地拒绝工作：

 const isRequired = () => { throw new Error('param is required'); }; const hello = (name = isRequired()) => { console.log(`hello ${name}`) }; //    ,     name hello(); //     hello(undefined); //        hello(null); hello('David');

在我们面前是对传递给函数的内容的另一层次的验证。

6.破坏性分配和对象提取属性的新名称

分解是JavaScript的一项新实用功能，但有时需要分配从对象检索到的属性的名称，这些名称应与它们在对象中具有的名称不同。方法如下：

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

在需要避免变量名或常量冲突的情况下，此技术很有用。

7.解析查询字符串

多年来，我们已经编写了正则表达式来解析查询字符串，但是这些时代已经过去了。现在，要解决此问题，您可以使用出色的API URLSearchParams ：

 // ,     "?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"

与使用正则表达式解决相同的任务相比，使用URLSearchParams API要容易得多。

总结

现代JavaScript的发展非常迅速，并且不断出现各种有用的改进。但是，改进语言并不意味着程序员无需考虑代码，也无需寻找解决其面临的各种问题的有效解决方案。我们希望我们今天讨论的JavaScript小技巧能派上用场。

亲爱的读者们！ 您知道任何有用的JS编程技巧吗？如果是这样，请分享。

JavaScript：7个有用的小东西