JavaScript 中怎么实现数组的隐藏

发布时间：2021-06-30 18:13:35 作者：Leah
来源：亿速云阅读：992

JavaScript 中怎么实现数组的隐藏，很多新手对此不是很清楚，为了帮助大家解决这个难题，下面小编将为大家详细讲解，有这方面需求的人可以来学习下，希望你能有所收获。

.filter()

我想我不需要讨论过滤数组有多有用。使用.filter()你可以做到这一点!你所要做的就是传递一个过滤函数，给定当前元素的值、索引和源数组，该函数会输出布尔值，用于指示给定元素是否应该包含在结果数组中。

.map()

.map()可能是FP定制的JS编程中***的数组方法之一。如你所指，它使用给定的映射函数来处理(“map”)你的数组，并返回一个带有新处理过的数据的新数组。上面提到的函数提供了一个标准参数集，其中包括元素、索引和源数组参数，并且应该返回将要包含在结果中的值。因此，有了所有这些数据，你就已经具备了以你想要的方式改变你的数组所需要的所有东西.

.flat[Map]()

嵌套数组在现在是很常见的。实践证明它们在表示2D或3D数据格式时特别有用。使用这样的维度完全有可能进行更深入的研究，但是，正如我们都知道的，跟踪和访问这样的数据会变得越来越困难。ECMAScript规范的开发人员清楚地认识到了这种模式，并从***的ES规范和始终绿色的浏览器开始，为我们引入了新的.flat()方法。它的规则很简单——它只是按指定的深度(默认为1)将嵌套数组扁平化，并有效地为你提供一个比以往任何时候都要扁平的数组!

还有另一个与数组扁平化相关的方法。我说的是. flatMap()，正如你所预料的，它是.map()和.flat()方法的***结合。基本上，你可以像.map()那样使用这个方法——使用相同的参数集，等等，但是生成的数组稍后会被扁平化1层。很简单的。那么，这种方法可能的用例有哪些?为此，请思考一下下面的字符串处理示例。

也许这有点粗略，但我想你已经明白了。一旦你理解了这个方法是如何工作的，你肯定会发现一些你自己的用例。附注,这种方法比分别使用.map()和.flat()性能要好一点。

交互

“交互”类别将所有在源数组上运行的方法进行了分组，这些方法并不会提供一个全新的数组，而是对数组进行改变或返回完全不同类型的值。

.reverse()

当然，.reverse()方法很简单，但是不太为人所知，它的作用与其名称的含义完全相同——反转数组中元素的顺序。因此，***的将被放在***个。在处理不同类型的队列时，这个方法很可能会派上用场。记住，这个方法会改变源数组。

.reduce[Right]()

如果你想快速地将你的数组(“reduce”)转换为单个值，你可以使用.reduce()方法来轻松地实现。如果提供了正确的函数(所谓的缩减器)，它稍后会对数组中的每个元素执行该函数，并将结果累积到一个变量中。

这个参数函数会返回一个累积值，稍后你可以用它的***个参数来引用它。在顶峰时，该函数可以提供4个参数(按给定顺序):

累积值 (可以是字符串、数组、对象或任何其他什么);

数组的当前值会被缩减;

当前值的索引;

将被缩减的数组;

如果缩减顺序对你来说很重要，那么你应该知道你还可以使用.reduceRight()方法，它与前面的方法执行完全相同的操作，但是它是从右边开始，向前进行。

.find[Index]()

查找数组中的特定元素可能是一项艰巨的任务，除非它是***个或***一个元素。这里，ES6规范中添加的 .find()方法就非常有用。它只接受处理标准参数集的检查函数，并从给定数组中返回***个匹配的值，否则返回undefined。

还有一个.findIndex()方法，与***个方法一样，它使用匹配函数来查找值，但是返回的是索引而不是原始值。它可以与.indexOf() 或 .lastIndexOf()进行比较，也可以用来检索与提供的值匹配的***个和***一个值的索引，但是它的表达能力不如.findIndex()及其匹配函数。

***一点需要注意的是——如果你使用.indexOf()只是为了检查一个值是否在给定的数组中，你可以考虑使用.includes() (ES6特性)——它返回一个布尔值，并且比它的替代方法具有更好的性能。

.every()

正如一些人所期望的那样，.every()只是在给定数组的每个元素上运行提供的函数，这里的命名可能会产生误导。相反，.every()确实在每个元素上运行一个函数，但只是为了检查它们是否遵循了我们提供的准则，并最终返回一个合法的布尔值。检查函数提供了参数的标准集合。

.copyWithin()

对于某些人来说，在单个数组的边界内复制数据可能会有点复杂和无意义。但是，由于它优越的性能(特别是对它的对手TypedArrays来说)，这个方法提供了一种快速移动数组元素的好方法! 在这里，你可以传入1到3个参数:

复制的数据将被粘贴的目标索引。由于 .copyWithin()不会改变源数组的长度，因此，源数组会被替换，旧的数据会被移除。

开始索引，标记要复制的数据的开头(默认为0，数组的起始索引)

结束索引，标记要复制的数据的末尾(不包括提供的索引)(默认为.length，即给定数组的末尾)

.sort()

.sort()是执行其名称所说明的操作的方法之一。在本例中，它只是对数组进行排序，你可以为它提供一个比较函数，也可以不提供。默认情况下，所有的值都会被转换成字符串，并按照UTF-16编码进行升序排序，也就是说数字从小到大，字符串按照字母表顺序。你也可以提供一个接受两个元素作为独立参数进行比较的函数。这个比较函数会返回一个数字，它将被用于以一个给定的方式对提供的值进行排序。

如果函数返回的数小于0，则作为***个参数提供的值优先;

如果函数返回的数字等于0，则值将保持不变(规范并没有真正保证);

如果函数返回的数大于0，则作为第二个参数提供的值优先;

.some()

.some()是一个类似于.every()的方法。它检查源数组中的元素是否满足某些规则(以检查函数的形式提供)，并在***返回一个布尔值。所不同的是, .some()只需要一个元素满足测试,就返回一个正值,不像.every()那样要求每个元素都满足测试。它可以帮助你，例如检查是否至少有一个值带有给定的属性。提供的测试函数接收一个标准参数集合(元素、索引和源数组)。

迭代

令人惊讶!实际上，在数组API中，只有一个方法可以执行迭代操作。对于那些使用.map()、.reduce()和类似方法的人来说，这只是一个警告，因为这些方法只用于遍历源数组。只有一个方法适用于这个任务，因此，它应该被尊重和众所周知。

.forEach()

.forEach()会执行其名称所代表的操作——遍历源数组的每个元素。在提供一个接收标准参数集的函数的情况下，它会在给定数组的每个元素上运行该函数。

其他

除了以上所有类别之外，数组API还有更多的方法。下面是其中一些，它们肯定不太为人所知和使用，但在某些特殊情况下可能会派上用场。

.entries()

.entries()是三个返回迭代器-对象方法中的***个。数组迭代器对象或所谓的iterable是一个简单的结构，可以通过使用for... of循环对该结构进行迭代，它还有一个单独的.next()方法，该方法在迭代时被称为底层方法。当直接调用时，它会返回一个包含value和done属性的对象，这两个属性分别指示当前值和迭代是否完成。当再次调用时,它会返回数组的下一个值,这个过程会持续到源数组的末尾，此时，done 属性将被设置为true。

.entries()方法返回的迭代器将带有以键值对(数组)的形式存在的值，其中***个元素表示当前索引，第二个元素表示各自的值。你可以将其(稍后将讨论其他方法)与对应的对象进行比较。像Object.entries()或Object.keys() (不在原型中)这样的函数当然比它们的数组兄弟函数更受欢迎，但是它们也做类似的事情。