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 相关文章推荐
11款新鲜的jQuery插件[附所有demo下载]
Jan 24 Javascript
Javascript实现重力弹跳拖拽运动效果示例
Jun 28 Javascript
JavaScript用select实现日期控件
Jul 17 Javascript
跟我学习javascript的var预解析与函数声明提升
Nov 16 Javascript
jQuery移动web开发中的页面初始化与加载事件
Dec 03 Javascript
一起学写js Calender日历控件
Apr 14 Javascript
JavaScript必知必会(二) null 和undefined
Jun 08 Javascript
用原生JS对AJAX做简单封装的实例代码
Jul 13 Javascript
jQuery选择器实例应用
Jan 05 Javascript
浅谈super-vuex使用体验
Jun 25 Javascript
如何实现一个webpack模块解析器
Oct 24 Javascript
JavaScript ECMA-262-3 深入解析(一):执行上下文实例分析
Apr 25 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
用C/C++扩展你的PHP 为你的php增加功能
2012/09/06 PHP
PHP源码分析之变量的存储过程分解
2014/07/03 PHP
php 流程控制switch的简单实例
2016/06/07 PHP
thinkPHP内置字符串截取函数用法详解
2016/11/15 PHP
PHP有序表查找之插值查找算法示例
2018/02/10 PHP
google地图的路线实现代码
2009/08/20 Javascript
js 纯数字不重复排列的另类方法
2010/07/17 Javascript
最佳的addEvent事件绑定是怎样诞生的
2011/10/24 Javascript
在js中判断checkboxlist(.net控件客户端id)是否有选中
2013/04/11 Javascript
jquery 页面滚动到底部自动加载插件集合
2014/01/31 Javascript
跟我学Node.js(四)---Node.js的模块载入方式与机制
2014/06/04 Javascript
浅析javascript操作 cookie对象
2014/12/26 Javascript
jQuery中:lt选择器用法实例
2014/12/29 Javascript
禁止按回车键提交表单的方法
2015/06/11 Javascript
Javascript中Array用法实例分析
2015/06/13 Javascript
vue单页应用中如何使用jquery的方法示例
2017/07/27 jQuery
js实现下拉框二级联动
2018/12/04 Javascript
javascript中数组的常用算法深入分析
2019/03/12 Javascript
使用jQuery如何写一个含验证码的登录界面
2019/05/13 jQuery
一篇文章带你搞懂Vue虚拟Dom与diff算法
2020/08/25 Javascript
[47:48]DOTA2上海特级锦标赛D组小组赛#2 Liquid VS VP第三局
2016/02/28 DOTA
Python设计模式之观察者模式实例
2014/04/26 Python
Python中生成器和yield语句的用法详解
2015/04/17 Python
Python操作mysql数据库实现增删查改功能的方法
2018/01/15 Python
基于循环神经网络(RNN)的古诗生成器
2018/03/26 Python
浅析Django中关于session的使用
2019/12/30 Python
tensorflow 获取所有variable或tensor的name示例
2020/01/04 Python
让IE下支持Html5的placeholder属性的插件
2014/09/02 HTML / CSS
改变生活的男士内衣:SAXX Underwear
2019/08/28 全球购物
老教师工作总结的自我评价
2013/09/27 职场文书
通息工程毕业生自荐信
2013/10/16 职场文书
精彩的大学生自我评价
2013/11/17 职场文书
八年级历史教学反思
2014/01/10 职场文书
2014党的群众路线教育实践活动总结报告
2014/10/31 职场文书
2015社区个人工作总结范文
2015/05/13 职场文书
女方家长婚礼致辞
2015/07/27 职场文书