前端进阶：总结几种常用的JS搜索算法和性能对比性能，然后发现for循环、forEach、while的性能差异，我们也会学习如何通过webworker做算法分片，大大提升性能的算法。同时，我会简单介绍一下经典的二进制算法和哈希表查找算法，但这些都不是本章的重点。我会发布相应的文章来详细介绍这些高级算法。感兴趣的朋友可以关注我的专栏，或者一起讨论。对于算法性能，我们还是会用到上一章的getFnRunTime函数《前端算法系列》如何让前端代码速度提升60倍。有兴趣的可以去看看学习一下。我不会在这里解释太多。在上一章《前端算法系列》如何将前端代码速度提升60倍，我们模拟了19000条数据。本章为了让效果更明显，我会伪造170万条数据来测试，相信我，对于js来说没什么。..1、for循环查找的基本思想：通过for循环遍历数组，找出数组中待查找值的索引，并将其压入新数组中代码实现如下：constgetFnRunTime=require('./getRuntime');/***常用算法-for循环版本*@param{*}arr*耗时：7-9ms*/functionsearchBy(arr,value){letresult=[];for(leti=0,len=arr.length;i{if(item===value){result.push(i);}})returnresult}耗时21-24毫秒，可见性能不如for循环（暂且这样说，本质是一样的）。3、while循环代码如下：/***常用算法-while循环版本*@param{*}arr*耗时：11ms*/functionsearchByWhile(arr,value){leti=arr.length,result=[];while(i){if(arr[i]===value){result.push(i);}i--;}returnresult}可以看出while和for循环的性能差不多，两者都很优秀，但不代表forEach的性能一样不好，不要用。与for循环相比，foreach减少了代码，但是foreach依赖于IEnumerable。在运行时比for循环效率低。但是在处理循环次数不确定的循环，或者需要计算循环次数的时候，用foreach更方便。而且foreach的代码经过编译系统的代码优化后，类似于for循环的循环。4、二分查找二分查找更多的应用场景是在一个数组中，数组中的值是唯一且有序的，所以这里就不比较它和for/while/forEach的性能了。基本思想：从序列中间开始比较，如果当前位置值等于要查找的值，则查找成功；如果要查找的值小于当前位置值，则在序列的前半部分查找；如果要查找的值大于当前位置值，则继续在序列的后半部分查找，直到找到为止。代码如下：/***BinaryAlgorithm*@param{*}arr*@param{*}value*/functionbinarySearch(arr,value){letmin=0;letmax=arr.length-1;while(min<=max){constmid=Math.floor((min+max)/2);if(arr[mid]===value){returnmid;}elseif(arr[mid]>value){max=mid-1;}else{min=mid+1;}}return'NotFound';}在数据量很大的场景下，二分法效率很高，但是不稳定，这也是大数据查询下的一个小缺点。5.哈希表查找哈希表查找也称为哈希表查找。通过查找关键字，无需比对就可以得到记录的存储位置。它在记录的存储位置与其关键字之间建立确定性。对应f，使每个关键字key对应一个存储位置f(key)哈希表查找使用场景：哈希表问题最适合的解决方案是找到等于给定值的记录。hash查找不适合同一个多条记录对应的关键字不适合范围搜索，比如搜索18到22岁的学生。这里我给出最简单的hashTable版本，让大家更容易理解hash：/***哈希表*以下方法会造成数据覆盖问题*/functionHashTable(){vartable=[];//哈希函数varloseloseHashCode=function(key){varhash=0;for(vari=0;i
