JavaScript 上万关键字瞬间匹配实现代码


Posted in Javascript onJuly 07, 2013

提到关键字搜索,首先联想到的无非就是使用一些indexOf,replace之类的字符函数,最多加上一些正则表达式而已.实现起来虽然很简单,但是这背后的效率问题可曾仔细考虑过?例如论坛中的关键字过滤,一般情况下需过滤的关键字数量及检测的文本长度都不大,所以这一瞬间的过程没有太多值得关注的地方。但若关键字数量不在是屈指可数,而是有成千上万, 并且待检测的文本也是一长篇大论,结果可不再是那么乐观了。大家都知道,每多一个关键字,就要增加一次全文的检索,最终花费的时间将远远超出可接受的范围内。

既然考虑的是那种极端的关键字搜索,通常的逐个遍历搜索显然是行不通的。如今用的是JavaScript,若不使用Hash表实在是太对不起这门语言了。有着对表特天独厚的支持,不妨就拿出少量的空间来换取大量的时间吧。

先看个例子,比如有如下的关键字: foo1,foo2,bar1,bar2,既然要用空间换时间,因此搜索之前先将他们预处理。前面提到了JS灵活又高效的表,显而易见,使用树的结构是最有优势的。即使不明白,也没关系,最终实现结构正如如下的代码,熟悉JSON同样很亲切:

var Root =
{
    f:
    {
        o:
        {
            o:
            {
: true,
: true
            }
        }
    },
    b:
    {
        a:
        {
             r:
            {
: true,
: true
            }
        }
    }
};

这一层层的结构正如一棵树,每个字符便是树的一个分枝,到了最后一个字符便是树叶,不再有新的节点。

此时你应该明白了,只要对文章的每个字沿着这棵树往下搜就是了。能到达树叶的,就说明当前字符就是关键字的一个;中途寻找不到对应枝干的,当然就不是关键字。

例如foo1,顺着Root结构向下访问,最终到达Root['f']['o']['o']['1'],即完成了一次匹配。之后跳过foo1的长度,继续往后检索。

因此,整篇文章只需一次检索,即可找出每个关键字的位置。

由于JS的hash表性能非常高,所以所谓的寻找枝干也就非常的快了。因为JS的灵活性,实现此效果的代码同样很简短。

事实上可以发现,关键字的数量与搜索的时间并没太多的关系,那仅仅影响了树的宽度而已,只有文章的长度才是决定搜索的时间。

来一次极限测试:

关键字: 成语全集(19830条)

内容:诛仙全集.txt (1659219字)

用时:935ms

(Chrome26 / i3-2312的CPU)
160万字的文章,匹配2万个关键字,还不到1秒的时间。可见,充分利用JavaScript的灵活性,仍能发挥很大的潜力。

Javascript 相关文章推荐
JScript中的"this"关键字使用方式补充材料
Mar 08 Javascript
js采用map取到id集合组并且实现点击一行选中一行
Dec 16 Javascript
解决ajax不能访问本地文件问题(利用js跨域原理)
Jan 24 Javascript
详解如何用webpack打包一个网站应用项目
Jul 12 Javascript
vue基于Element构建自定义树的示例代码
Sep 19 Javascript
JS 实现分页打印功能
May 16 Javascript
浏览器事件循环与vue nextTicket的实现
Apr 16 Javascript
轻松解决JavaScript定时器越走越快的问题
May 13 Javascript
es6中比较有用的7个技巧小结
Jul 12 Javascript
vue2.0+SVG实现音乐播放圆形进度条组件
Sep 21 Javascript
JS中FormData类实现文件上传
Mar 27 Javascript
解决vue组件销毁之后计时器继续执行的问题
Jul 21 Javascript
20行代码实现的一个CSS覆盖率测试脚本
Jul 07 #Javascript
在JavaScript里嵌入大量字符串常量的实现方法
Jul 07 #Javascript
JQuery表格内容过滤的实现方法
Jul 05 #Javascript
JS动态创建Table,Tr,Td并赋值的具体实现
Jul 05 #Javascript
Javascript实现动态菜单添加的实例代码
Jul 05 #Javascript
javascript实现跳转菜单的具体方法
Jul 05 #Javascript
JavaScript获取和设置CheckBox状态的简单方法
Jul 05 #Javascript
You might like
简单易用的计数器(数据库)
2006/10/09 PHP
快速配置PHPMyAdmin方法
2008/06/05 PHP
PHP URL地址获取函数代码(端口等) 推荐
2010/05/15 PHP
处理单名多值表单的详解
2013/06/08 PHP
php中文验证码实现示例分享
2014/01/12 PHP
php通过字符串调用函数示例
2014/03/02 PHP
PHP hex2bin()函数用法讲解
2019/02/25 PHP
让焦点自动跳转
2006/07/01 Javascript
JavaScript 中的replace方法说明
2007/04/13 Javascript
jquery 图片截取工具jquery.imagecropper.js
2010/04/09 Javascript
javascript对JSON数据排序的3个例子
2014/04/12 Javascript
js不能获取隐藏的div的宽度只能先显示后获取
2014/09/04 Javascript
jQuery中:first-child选择器用法实例
2014/12/31 Javascript
基于Flowplayer打造一款免费的WEB视频播放器附源码
2015/09/06 Javascript
jQuery自定义滚动条完整实例
2016/01/08 Javascript
AngularJS变量及过滤器Filter用法分析
2016/11/22 Javascript
Bootstrap实现提示框和弹出框效果
2017/01/11 Javascript
jQuery实现获取隐藏div高度的方法示例
2017/02/09 Javascript
数组Array的一些方法(总结)
2017/02/17 Javascript
解决Vue2.0自带浏览器里无法打开的原因(兼容处理)
2017/07/28 Javascript
详解react使用react-bootstrap当轮子造车
2017/08/15 Javascript
编写React组件项目实践分析
2018/03/04 Javascript
微信小程序模板消息限制实现无限制主动推送的示例代码
2019/08/27 Javascript
详解react组件通讯方式(多种)
2020/05/06 Javascript
在vue中使用防抖函数组件操作
2020/07/26 Javascript
Vue实现腾讯云点播视频上传功能的实现代码
2020/08/17 Javascript
python中二维阵列的变换实例
2014/10/09 Python
在Python中使用SQLite的简单教程
2015/04/29 Python
Python针对给定字符串求解所有子序列是否为回文序列的方法
2018/04/21 Python
Python request中文乱码问题解决方案
2020/09/17 Python
ALDO英国官网:加拿大女鞋品牌
2018/02/19 全球购物
俄罗斯第一家篮球店:StreetBall
2020/07/30 全球购物
外贸采购员求职的自我评价
2013/11/26 职场文书
工厂总经理岗位职责
2014/02/07 职场文书
2014党员民主评议个人思想剖析发言
2014/09/19 职场文书
天那边观后感
2015/06/09 职场文书