Javascript面试题-找出数组中频率最高元素的多种方法

原创 coder分享 2017-05-29 11:19

前言

在前端面试题中，关于Javascript的部分是至关重要的，最近的一系列文章都是Javascript面试题相关的，大家可以自己实现一下，我也将题目和答案开源了，感兴趣的可以自取。

Javascript

题目

今天这篇文章里的题目是这样的，如何找出一个数组中出现次数最多是元素？例如给定一个数组

[3, 5, 6, 5, 9, 8, 10, 5, 7]

其中5出现的次数最多，结果返回5，而且其出现次数为3。接下来我们就一起来看看这道题目的几种实现方式。

以下是github地址，大家可以直接去看源码。

https://github.com/zhouxiongking/article-pages/blob/master/articles/maxFrequencyNum/maxFrequencyNum.js

方法1

实现方法1的主要思想是利用键值对存储，我们可以分解为两个步骤。

1. 定义一个对象，在遍历数组的时候，将数组元素作为对象的键，将出现的次数作为值

2. 获取键值对后进行遍历，获取值最大的那个元素，返回后即可得到结果。

通过以上的思想，我们可以得到以下实现代码。

方法1

因为方法1会首先对数组进行遍历，然后对对象进行遍历，在实现效率上比较低下，不推荐使用。

方法2

实现方法2的主要思想同方法1，不过是方法1的优化，将方法1中的两次遍历缩减为一次遍历，将值的判断放在同一个遍历中。

得到的优化代码如下。

方法2

方法3

方法3的主要思想是借助数组Array的reduce方法。

首先我们来看看reduce方法的使用方法，它的语法如下。

arr.reduce([callback, initialValue])

reduce方法接收的第一个参数为函数，操作数组中的每个元素。该函数接收4个参数，每个参数的含义如下。

1. 第一个参数表示上一次执行结果的回调，或者第二个参数提供的初始值

2. 当前处理的元素值

3. 当前处理元素的索引

4. 处理的数组

reduce方法接收的第二个参数为提供处理元素的初始值，与上面的第一个参数有关。

在了解reduce方法后，我们可以直接看看下面的代码。

方法3

其中reduce接收一个{}表示的初始值，p的初始值就是这个{}，k就是每次执行的数组元素。在每次执行完后与maxNum进行比较，动态更新maxNum与maxEle值，最后获得返回的结果。

方法4

方法4的主要思想是借助于字符串的replace方法，因此方法4主要适用于字符数组的运算。

首先将数组转化为字符串，然后通过字符串的replace方法，接收处理函数，其他的原理与方法3一样。

方法4

对于以上的每个方法，我都进行了测试，根据返回的结果来看都验证了方法的正确性。

方法5

方法5其实是利用ES6语法以及逗号运算符进行的代码优化，这个方法看起来代码量很少，但是理解起来却需要花费一定的功夫。建议先学习下ES6函数语法以及逗号运算符的相关知识。

方法5

结束语

今天这篇文章主要讲解了，关于数组中如何找出频率最大的元素以及出现的次数的几种方法，对你有帮助吗？