Question

我有一个JavaScript变量，它包含一些字典单词，如

var words = ['and','cat', n1, n2, n3 and so on ]

这个数组大约有58020个单词。

我所做的是创建了一个自动完成的jQuery插件，当用户开始在文本框中键入文本时，该插件会在下拉列表中显示字典数组中的单词。但浏览器在某些时候崩溃了，因为我认为循环每个单词会使进程变慢。

我怎样才能克服这个？

这是检查单词数组并输出单词的函数

$(textInput).keyup(function(e) {

            var text = $(this).val();
            var foundTag = false;

            for (var i = 0; i < settings.tags.length; i++) {

                var tagName = settings.tags[i].toLowerCase();
                if (tagName.startsWith(text)) {

                    if (text != '') {
                        foundTag = true;
                        $(settings.tagContainer).append(GetDivDropDownItem(settings.tags[i]));
                    }
                    else {
                    }

                }

            }

        });

修改

$(textInput).keyup(function(e) {

            var text = $(this).val();
            var foundTag = false;

            for (var i = 0; i < settings.words.length; i++) {

                var tagName = settings.words[i].toLowerCase();
                if (tagName.startsWith(text)) {

                    if (text != '') {
                        foundTag = true;
                        $(settings.tagContainer).append(GetDivDropDownItem(settings.words[i]));
                    }
                    else {
                    }

                }

            }

        });


var GetDivDropDownItem = function(text) {

        var cWidth = $(container).css("width");
        cWidth = cWidth.split("px")[0];

        var tag = $("<div/>");
        $(tag).css("paddingLeft", "5px");
        $(tag).css("paddingRight", "5px");
        $(tag).css("paddingBottom", "5px");
        $(tag).css("paddingTop", "5px");
        $(tag).css("width", cWidth - 10);
        $(tag).css("float", "left");

        $(tag).css("fontFamily", "Arial");
        $(tag).css("fontSize", "12px");
        $(tag).css("color", "#6A6B6C");
        $(tag).text(text);

        return $(tag);

    };

Answer 1

您需要使用更好的数据结构和算法。总的来说，我建议在尝试解决任何问题之前先对已有的工作进行一些研究。

这是一篇可能有所帮助的文章：http://orion.lcg.ufrj.br/Dr.Dobbs/books/book5/chap08.htm

Answer 2

请参阅jQuery创建者John Resig所做的基准测试和比较：

http://ejohn.org/blog/revised-javascript-dictionary-search/

基本上答案是一个简单的trie结构，如果你真的想做纯JS。

Answer 3

不要在Javascript数组中放入58.000个单词。

使用包含数据库中所有字典单词的Web服务，然后查询。

编辑：如果您真的坚持将其存储在javascript数组中，请按前两个字符对单词进行分组。易于实施，速度提高约600倍。

Answer 4

trie数据结构对字典有用。

Answer 5

假设settings.tags是字典单词数组，这段代码将非常繁琐，因为你循环遍历整个数组keyup事件。

我建议您在结构中组织字典单词，以便您快速查看单词。也许是二叉树或只是一个关联数组。

我应该如何存储和检索字典单词

修改

5 个答案: