JavaScript 上萬關鍵字瞬間匹配實現(xiàn)代碼
更新時間:2013年07月07日 23:36:21 作者:
發(fā)一篇之前寫的文章,平時還是經常用到的,尤其是河蟹詞特別多的聊天系統(tǒng)里
提到關鍵字搜索,首先聯(lián)想到的無非就是使用一些indexOf,replace之類的字符函數,最多加上一些正則表達式而已.實現(xiàn)起來雖然很簡單,但是這背后的效率問題可曾仔細考慮過?例如論壇中的關鍵字過濾,一般情況下需過濾的關鍵字數量及檢測的文本長度都不大,所以這一瞬間的過程沒有太多值得關注的地方。但若關鍵字數量不在是屈指可數,而是有成千上萬, 并且待檢測的文本也是一長篇大論,結果可不再是那么樂觀了。大家都知道,每多一個關鍵字,就要增加一次全文的檢索,最終花費的時間將遠遠超出可接受的范圍內。
既然考慮的是那種極端的關鍵字搜索,通常的逐個遍歷搜索顯然是行不通的。如今用的是JavaScript,若不使用Hash表實在是太對不起這門語言了。有著對表特天獨厚的支持,不妨就拿出少量的空間來換取大量的時間吧。
先看個例子,比如有如下的關鍵字: foo1,foo2,bar1,bar2,既然要用空間換時間,因此搜索之前先將他們預處理。前面提到了JS靈活又高效的表,顯而易見,使用樹的結構是最有優(yōu)勢的。即使不明白,也沒關系,最終實現(xiàn)結構正如如下的代碼,熟悉JSON同樣很親切:
var Root =
{
f:
{
o:
{
o:
{
: true,
: true
}
}
},
b:
{
a:
{
r:
{
: true,
: true
}
}
}
};
這一層層的結構正如一棵樹,每個字符便是樹的一個分枝,到了最后一個字符便是樹葉,不再有新的節(jié)點。
此時你應該明白了,只要對文章的每個字沿著這棵樹往下搜就是了。能到達樹葉的,就說明當前字符就是關鍵字的一個;中途尋找不到對應枝干的,當然就不是關鍵字。
例如foo1,順著Root結構向下訪問,最終到達Root['f']['o']['o']['1'],即完成了一次匹配。之后跳過foo1的長度,繼續(xù)往后檢索。
因此,整篇文章只需一次檢索,即可找出每個關鍵字的位置。
由于JS的hash表性能非常高,所以所謂的尋找枝干也就非常的快了。因為JS的靈活性,實現(xiàn)此效果的代碼同樣很簡短。
事實上可以發(fā)現(xiàn),關鍵字的數量與搜索的時間并沒太多的關系,那僅僅影響了樹的寬度而已,只有文章的長度才是決定搜索的時間。
來一次極限測試:
關鍵字: 成語全集(19830條)
內容:誅仙全集.txt (1659219字)
用時:935ms
(Chrome26 / i3-2312的CPU)
160萬字的文章,匹配2萬個關鍵字,還不到1秒的時間??梢姡浞掷肑avaScript的靈活性,仍能發(fā)揮很大的潛力。
既然考慮的是那種極端的關鍵字搜索,通常的逐個遍歷搜索顯然是行不通的。如今用的是JavaScript,若不使用Hash表實在是太對不起這門語言了。有著對表特天獨厚的支持,不妨就拿出少量的空間來換取大量的時間吧。
先看個例子,比如有如下的關鍵字: foo1,foo2,bar1,bar2,既然要用空間換時間,因此搜索之前先將他們預處理。前面提到了JS靈活又高效的表,顯而易見,使用樹的結構是最有優(yōu)勢的。即使不明白,也沒關系,最終實現(xiàn)結構正如如下的代碼,熟悉JSON同樣很親切:
復制代碼 代碼如下:
var Root =
{
f:
{
o:
{
o:
{
: true,
: true
}
}
},
b:
{
a:
{
r:
{
: true,
: true
}
}
}
};
這一層層的結構正如一棵樹,每個字符便是樹的一個分枝,到了最后一個字符便是樹葉,不再有新的節(jié)點。
此時你應該明白了,只要對文章的每個字沿著這棵樹往下搜就是了。能到達樹葉的,就說明當前字符就是關鍵字的一個;中途尋找不到對應枝干的,當然就不是關鍵字。
例如foo1,順著Root結構向下訪問,最終到達Root['f']['o']['o']['1'],即完成了一次匹配。之后跳過foo1的長度,繼續(xù)往后檢索。
因此,整篇文章只需一次檢索,即可找出每個關鍵字的位置。
由于JS的hash表性能非常高,所以所謂的尋找枝干也就非常的快了。因為JS的靈活性,實現(xiàn)此效果的代碼同樣很簡短。
事實上可以發(fā)現(xiàn),關鍵字的數量與搜索的時間并沒太多的關系,那僅僅影響了樹的寬度而已,只有文章的長度才是決定搜索的時間。
來一次極限測試:
關鍵字: 成語全集(19830條)
內容:誅仙全集.txt (1659219字)
用時:935ms
(Chrome26 / i3-2312的CPU)
160萬字的文章,匹配2萬個關鍵字,還不到1秒的時間??梢姡浞掷肑avaScript的靈活性,仍能發(fā)揮很大的潛力。
相關文章
JS和jQuery使用submit方法無法提交表單的原因分析及解決辦法
這篇文章主要介紹了JS和jQuery使用submit方法無法提交表單的原因分析及解決辦法的相關資料,需要的朋友可以參考下2016-05-05
根據對象的某一屬性進行排序的js代碼(如:name,age)
實例為按降序排列,若想改為升序只需把比較器中的value2-value1改為value1-value2就可以了2010-08-08
Webpack 之 babel-loader文件預處理器詳解
這篇文章主要介紹了Webpack 之 babel-loader文件預處理器詳解,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
js根據手機客戶端瀏覽器類型,判斷跳轉官網/手機網站多個實例代碼
這篇文章主要介紹了js根據手機客戶端瀏覽器類型,判斷跳轉官網/手機網站多個實例代碼,需要的朋友可以參考下2016-04-04

