Question

我有非常大的字符串数组，我想用我的过滤方法快速过滤它至少需要7秒。即使它可以将光标悬挂7秒钟。

我的方法

    public query = ''; 
    public countries = []; // this is my large array 
    public filteredList = [];

    filter() {
    if (this.query !== ""){
        this.filteredList = this.countries.filter(function(el){
            return el.toLowerCase().indexOf(this.query.toLowerCase()) > -1;
        }.bind(this));
    }else{
        this.filteredList = [];
    }
}

这可以加快吗？

Answer 1

您可以做出一些应该有所帮助的更改：

public query = ''; 
public countries = []; // this is my large array 
public filteredList = [];

filter() {
    if (this.query !== ""){
    const lq = this.query.toLowerCase(); // Don't re-calculate this every time.

        this.filteredList = this.countries.filter(function(el){
            return el.toLowerCase().indexOf(lq) > -1;
        });  
        // ^ The `bind` can be removed, since you're no longer using `this` here.
    }else{
        this.filteredList = [];
    }
}

如果你想全力以赴，你可以切换.filter循环：

public query = ''; 
public countries = []; // this is my large array 
public filteredList = [];

filter() {
    this.filteredList = [];

    if (this.query !== ""){
        const lq = this.query.toLowerCase(); // Don't re-calculate this every time.

        for (var i = 0; i < countries .length; i++) {
            if (countries[i].toLowerCase().indexOf(lq) > -1)
                this.filteredList.push(countries[i])
        }
    }
}

Answer 2

我的尝试，没有经过测试......没有数据，也许不是最干净的代码，但我尝试了所有我能想到的性能...减少[dot]something查找的数量和什么不......

filter() {  
  if (this.query !== '') {

    const originalArr = this.countries

    // Maybe store this somewhere if you are running this function in
    // some search + autocomplete.
    // running lowercase once and rebuild the array might be faster
    // might be risky if the array entries can contain ',' but you can change it 
    const countries = originalArr.join().toLowerCase().split(',')



    const lq = this.query.toLowerCase() // Don't re-calculate this every time.
    const length = countries.length
    const filtered = []

    for (let i = 0; i < length; i++) {
      if (countries[i].indexOf(lq) > -1)
        filtered.push(originalArr[i])
    }

    this.filteredList = filtered
  } else {
    this.filteredList = []
  }

  this.filteredList = []
}

Answer 3

不确定这是否与客户端相关。但你尝试过使用datalist吗？如果是这样，那么它将全部是原生的，不区分大小写并且还会查看孔字符串，搜索far将匹配Safari

<label>Choose a browser from this list:
<input list="browsers" name="myBrowser" /></label>
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
  <option value="Microsoft Edge">
</datalist>

Answer 4

以下是人们可以玩的东西：

从technote创建字符串
生成150段，13399字，90569字节的Lorem Ipsum
（Stackoverflow限制为30000个字符）

使用以下方法将字符串转换为数组项：
http://www.lipsum.com/

我建议在控制台中使用chrome并降低CPU速度。

＆＃13;

var countries = [];

countries[0] = "Lorem ipsum dolor sit amet, consectetur adipiscing elit";
countries[1] = "Mauris vitae neque ut est sagittis efficitur";
countries[2] = "Donec vel metus eu ex pellentesque imperdiet";
countries[3] = "Curabitur molestie felis vel sagittis pellentesque";
countries[4] = "Suspendisse sollicitudin ligula eu ligula sollicitudin, non tristique nisl sodales";
countries[5] = "Aliquam pulvinar aliquam vulputate";
countries[6] = "Fusce enim arcu, suscipit ac auctor quis, maximus eu velit";
countries[7] = "Nunc vel felis nec nibh pulvinar egestas id sed orci.";
countries[8] = "Interdum et malesuada fames ac ante ipsum primis in faucibus";
countries[9] = "Integer dictum venenatis posuere";
countries[10] = "Cras feugiat, leo eget pretium consectetur, eros urna elementum lectus, vitae venenatis libero tellus at lectus";
countries[11] = "Quisque sagittis cursus ante eget iaculis";
countries[12] = "Sed aliquet sapien nisl, ornare placerat nulla ultrices id";
countries[13] = "Vivamus suscipit felis vitae lorem fermentum sodales";
countries[14] = "Integer finibus nulla finibus, ultricies elit a, ornare ex";
countries[15] = "Etiam sed sem turpis";
countries[16] = "Suspendisse consequat augue ut turpis viverra, sed maximus ex vulputate";
countries[17] = "Vestibulum ullamcorper nunc ac nibh ullamcorper, eget porttitor lorem lobortis";
countries[18] = "Etiam pretium id ex quis dictum";
countries[19] = "Integer scelerisque, justo eu vulputate facilisis, nisl dolor auctor dolor, eu porta sem odio at elit";
countries[20] = "Proin semper erat metus, molestie auctor enim condimentum sit amet.";
countries[21] = "Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus";
countries[22] = "Sed ornare ligula tincidunt eros accumsan, a dictum ante facilisis";
countries[23] = "Praesent tempor fermentum lectus, vitae consequat lectus lobortis eget";
countries[24] = "Pellentesque vel fermentum justo";
countries[25] = "Sed rhoncus quis purus sed porttitor";
countries[26] = "Morbi quis quam a est suscipit pellentesque";
countries[27] = "Proin sagittis interdum bibendum";
countries[28] = "Curabitur suscipit ante quam, in lobortis ipsum cursus eu";
countries[29] = "Nam et dui est";
countries[30] = "Maecenas laoreet lacus scelerisque, interdum nibh sit amet, pulvinar metus";
countries[31] = "Mauris vel consectetur quam.";
countries[32] = "Cras pretium nulla ipsum, id semper velit consectetur sed";
countries[33] = "Quisque sed arcu sed libero vulputate egestas at eu quam";
countries[34] = "Curabitur facilisis, nunc ac aliquet volutpat, arcu orci dignissim tellus, scelerisque laoreet sapien ex id sem";
countries[35] = "In hac habitasse platea dictumst";
countries[36] = "Fusce vel neque vel velit mattis pharetra non ut lorem";
countries[37] = "Duis fermentum metus in iaculis vestibulum";
countries[38] = "Suspendisse non neque eleifend, consectetur nulla ut, accumsan lorem";
countries[39] = "In quis est et arcu iaculis fringilla";
countries[40] = "Aliquam suscipit arcu vitae aliquet malesuada";
countries[41] = "Proin tincidunt ultrices augue";
countries[42] = "Curabitur vel hendrerit lacus";
countries[43] = "Morbi euismod neque a est dignissim consectetur";
countries[44] = "Cras vitae risus metus";
countries[45] = "Donec condimentum ante ante, ut sollicitudin neque finibus ut.";
countries[46] = "Maecenas ac rutrum justo, a rhoncus ex";
countries[47] = "Nullam iaculis a elit et ornare";
countries[48] = "Nulla facilisi";
countries[49] = "Fusce eu imperdiet ipsum";
countries[50] = "Suspendisse maximus augue vitae ultrices rhoncus";
countries[51] = "Maecenas mollis libero vel ipsum consequat suscipit";
countries[52] = "Pellentesque vitae ipsum et ligula luctus dictum";
countries[53] = "Integer egestas eu nibh id iaculis";
countries[54] = "Morbi vehicula placerat purus non tincidunt";
countries[55] = "Lorem ipsum dolor sit amet, consectetur adipiscing elit";
countries[56] = "Integer et fermentum mauris";
countries[57] = "Mauris tincidunt ex id velit vulputate, vel tempor lectus eleifend";
countries[58] = "Maecenas dignissim leo in ipsum auctor porta.";
countries[59] = "Quisque dui risus, fringilla sed hendrerit consectetur, venenatis fringilla libero";
countries[60] = "Mauris dignissim leo augue";
countries[61] = "Vestibulum dapibus velit vel justo placerat sollicitudin";
countries[62] = "Suspendisse aliquet purus at lacus luctus hendrerit";
countries[63] = "Donec et metus a est convallis accumsan";
countries[64] = "Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus";
countries[65] = "Nunc fringilla tortor velit, vel placerat tellus dictum ut";
countries[66] = "Sed consequat commodo ligula eget pharetra";
countries[67] = "Nullam vestibulum mi massa, posuere imperdiet lorem bibendum nec";
countries[68] = "Nunc consequat est a blandit ornare";
countries[69] = "Integer et rutrum libero";
countries[70] = "Curabitur vulputate quam non tellus pulvinar aliquam";
countries[71] = "Quisque feugiat urna in est elementum, vel pulvinar tortor commodo.";
countries[72] = "Ut pulvinar quis nulla id faucibus";
countries[73] = "Curabitur eget erat sed tellus laoreet suscipit";
countries[74] = "Ut congue in ligula ut porta";
countries[75] = "Nunc convallis justo dapibus risus ornare sagittis a ullamcorper ligula";
countries[76] = "Vestibulum eu ligula quis mi iaculis placerat a non lectus";
countries[77] = "Nam mi sapien, tristique eget odio maximus, condimentum cursus sapien";
countries[78] = "Vivamus lobortis dolor quis est aliquam, rutrum feugiat nibh porttitor";
countries[79] = "Cras sed tellus risus";
countries[80] = "Suspendisse pellentesque, augue et tristique ornare, augue orci facilisis quam, elementum pellentesque ipsum velit sit amet dui.";
countries[81] = "In et imperdiet metus";
countries[82] = "Etiam dignissim dolor quis lectus imperdiet, ac semper purus vehicula";
countries[83] = "Cras varius auctor velit ut gravida";
countries[84] = "Duis vel dui mi";
countries[85] = "Fusce vehicula tincidunt odio eget malesuada";
countries[86] = "Aliquam eu diam eu metus molestie iaculis";
countries[87] = "Nam consequat sodales lectus sed scelerisque";
countries[88] = "Suspendisse a tellus bibendum, facilisis sapien sed, tempor lectus";
countries[89] = "Nunc elit lacus, eleifend ut convallis in, fermentum nec nunc";
countries[90] = "Maecenas vitae lectus dictum, eleifend ante sed, fringilla lorem.";
countries[91] = "Vivamus non eros sem";
countries[92] = "Suspendisse erat diam, sollicitudin quis fermentum et, cursus a mi";
countries[93] = "Proin eget lorem eu mauris volutpat placerat non vitae nisl";
countries[94] = "In hac habitasse platea dictumst";
countries[95] = "Nunc eget sem quis massa tincidunt sagittis eu nec lorem";
countries[96] = "Suspendisse ante dolor, condimentum vitae risus sed, convallis pulvinar eros";
countries[97] = "Integer id tempor massa, in semper magna";
countries[98] = "Nullam augue velit, viverra pharetra elit egestas, vestibulum molestie sem";
countries[99] = "Donec sed nibh viverra, porttitor libero at, tincidunt mauris";
countries[100] = "Donec dignissim odio ac ipsum rutrum scelerisque a eget libero";
countries[101] = "Maecenas dictum leo et justo sollicitudin, sit amet tristique dolor euismod";
countries[102] = "Etiam in ex sit amet felis maximus tristique ac aliquet sem.";
countries[103] = "In ornare elementum ultricies";
countries[104] = "Proin rhoncus, diam id finibus facilisis, risus arcu pellentesque ipsum, a feugiat eros mauris at justo";
countries[105] = "Nulla ultricies nunc et erat pellentesque rhoncus";
countries[106] = "Pellentesque commodo lectus nulla, euismod finibus eros iaculis in";
countries[107] = "Nullam sit amet massa tempor, euismod nisi quis, efficitur urna";
countries[108] = "Suspendisse ex mauris, euismod ac erat eu, volutpat vehicula velit";
countries[109] = "Ut velit turpis, porttitor ut felis accumsan, vehicula porttitor orci";
countries[110] = "Nulla vestibulum leo odio, vitae scelerisque dolor fermentum sit amet.";
countries[111] = "Proin vitae odio auctor, placerat sapien eget, consectetur elit";
countries[112] = "Donec quis fermentum enim";
countries[113] = "Donec pharetra ante id dolor ullamcorper, nec luctus magna ullamcorper";
countries[114] = "Duis volutpat velit in lacus tincidunt tempor";
countries[115] = "Suspendisse pretium pretium rutrum";
countries[116] = "Sed in tincidunt neque";
countries[117] = "Pellentesque et pellentesque arcu, sit amet varius enim";
countries[118] = "Ut diam neque, ultricies nec ex a, convallis cursus purus";
countries[119] = "Pellentesque a libero risus";
countries[120] = "Curabitur condimentum, magna ut egestas rhoncus, purus mauris commodo tortor, a mattis arcu odio vel risus";
countries[121] = "Integer nisl felis, volutpat ut gravida sed, dapibus a orci";
countries[122] = "Vivamus eu tempus lorem, et interdum turpis";
countries[123] = "Nam eget lectus non turpis tempus blandit";
countries[124] = "Suspendisse eu vestibulum nisl";
countries[125] = "Mauris sed nulla suscipit, viverra neque ut, aliquam ipsum.";
countries[126] = "Etiam enim sapien, venenatis ut dapibus a, mattis ac metus";
countries[127] = "Vestibulum et magna non ipsum gravida molestie a consectetur purus";
countries[128] = "Donec volutpat sodales bibendum";
countries[129] = "Morbi ac diam eu sapien lacinia pellentesque id et enim";
countries[130] = "Aliquam mollis metus sit amet mauris tristique, tincidunt blandit eros faucibus";
countries[131] = "Praesent et felis a urna rhoncus interdum id at ex";
countries[132] = "Aenean dignissim metus elit, quis pretium nisi pretium et";
countries[133] = "Aliquam et odio nisi";
countries[134] = "Mauris aliquam, felis eu pretium finibus, orci lorem malesuada lacus, id dignissim tortor magna aliquet nibh";
countries[135] = "Cras interdum eget mauris lobortis suscipit";
countries[136] = "Maecenas in tristique purus, a aliquet elit";
countries[137] = "Sed mollis ligula vitae elementum venenatis";
countries[138] = "Suspendisse mattis neque non sem porttitor gravida";
countries[139] = "Aliquam sit amet ante maximus, sagittis odio a, pulvinar lorem";
countries[140] = "In pulvinar pharetra tellus vitae tincidunt.";
countries[141] = "Morbi sed eleifend neque, ut lobortis nunc";
countries[142] = "Sed viverra enim ac viverra tincidunt";
countries[143] = "Pellentesque sodales tortor orci, ac pellentesque est molestie vel";
countries[144] = "Praesent tempus luctus ligula, eget condimentum diam consequat eget";
countries[145] = "In gravida justo diam, id consequat est accumsan at";
countries[146] = "Sed lacinia lobortis ipsum a viverra";
countries[147] = "Curabitur vitae condimentum risus";
countries[148] = "Proin consectetur lobortis arcu, et volutpat felis tempor sed";
countries[149] = "Duis at condimentum ligula, ac facilisis lacus";
countries[150] = "Ut magna tellus, tincidunt eget eleifend quis, efficitur id metus";
countries[151] = "Nullam bibendum augue nec orci dapibus porta";
countries[152] = "Nulla sem tortor, feugiat at nisi sit amet, gravida imperdiet arcu";
countries[153] = "Curabitur mattis, ante in finibus ultricies, nibh lectus imperdiet leo, vel malesuada libero ligula in erat";
countries[154] = "Etiam molestie leo vel eros convallis mattis";
countries[155] = "Nam at dui id nisl tristique interdum quis vitae tortor";
countries[156] = "Fusce vitae lectus id augue volutpat vulputate eu sit amet ligula.";
countries[157] = "Aenean eleifend posuere ex et posuere";
countries[158] = "Curabitur sollicitudin ex ac eros ultrices, quis tincidunt lacus ultricies";
countries[159] = "Ut ac luctus quam";
countries[160] = "Mauris condimentum gravida neque, non pharetra lectus lobortis luctus";
countries[161] = "Quisque nec nunc iaculis, interdum justo at, tempus turpis";
countries[162] = "Cras eget rhoncus arcu, eu viverra leo";
countries[163] = "Vestibulum ut orci nec augue venenatis tristique eget in arcu";
countries[164] = "Duis venenatis enim massa, nec aliquam mauris fermentum vitae";
countries[165] = "Nam molestie convallis nulla, nec accumsan erat rhoncus a.";
countries[166] = "Donec sagittis et nisl quis fringilla";
countries[167] = "Quisque finibus a massa ut lacinia";
countries[168] = "In eu velit fringilla, posuere neque sit amet, imperdiet quam";
countries[169] = "Etiam id quam pretium, mattis sem ac, consectetur purus";
countries[170] = "Praesent pulvinar scelerisque tortor sit amet aliquet";
countries[171] = "Nulla lacinia orci purus, sed efficitur nunc varius ut";
countries[172] = "Vivamus nisi lorem, imperdiet dapibus lorem in, vestibulum feugiat neque";
countries[173] = "Vivamus ornare vehicula lectus, sed scelerisque nunc finibus eget.";
countries[174] = "Nulla facilisi";
countries[175] = "Integer leo lacus, tempus id consectetur vel, fermentum in magna";
countries[176] = "Mauris consectetur purus vitae turpis fringilla elementum";
countries[177] = "Integer id diam nisi";
countries[178] = "Curabitur lacus tortor, facilisis vel turpis in, ornare dignissim tortor";
countries[179] = "Maecenas a ligula sapien";
countries[180] = "Morbi laoreet arcu et tellus placerat, nec posuere augue viverra";
countries[181] = "Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas";
countries[182] = "Vivamus euismod feugiat ex, in condimentum est sagittis in";
countries[183] = "Pellentesque nisi risus, vulputate ac fermentum ac, hendrerit ac mi";
countries[184] = "Curabitur non nulla sit amet dolor ornare commodo";
countries[185] = "Praesent vestibulum in erat eget laoreet";
countries[186] = "Nunc elementum ex ut magna gravida ullamcorper";
countries[187] = "Nullam pharetra sed neque non porta";
countries[188] = "Mauris suscipit libero justo, sit amet mollis diam pharetra ac.";
countries[189] = "Nullam eget blandit lectus, nec ullamcorper erat";
countries[190] = "Integer ac purus elit";
countries[191] = "Maecenas dignissim risus sagittis quam ornare, non consequat metus congue";
countries[192] = "Nulla facilisi";
countries[193] = "Proin dignissim mattis eros, eu blandit risus elementum imperdiet";
countries[194] = "Curabitur eget nisi enim";
countries[195] = "Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus";
countries[196] = "Nulla rutrum vehicula ornare";
countries[197] = "Interdum et malesuada fames ac ante ipsum primis in faucibus";
countries[198] = "Nunc ultrices id sem luctus lobortis.";
countries[199] = "Aliquam erat volutpat";
countries[200] = "Curabitur venenatis odio nec odio eleifend aliquet";
countries[201] = "Donec finibus lorem sed ex vehicula auctor";
countries[202] = "Vivamus vestibulum imperdiet nisl, et pretium ligula varius eget";
countries[203] = "Proin et lacus in orci commodo porta";
countries[204] = "Sed hendrerit mi at ultricies pretium";
countries[205] = "Etiam nec fringilla elit";
countries[206] = "Sed venenatis dignissim nisl id aliquam";
countries[207] = "Morbi suscipit dolor sed rhoncus auctor";
countries[208] = "Nulla eget neque viverra, volutpat ex eu, volutpat dolor";
countries[209] = "Maecenas vulputate viverra lacus et pharetra";
countries[210] = "Curabitur sodales feugiat nisi nec facilisis";
countries[211] = "Quisque euismod nisl a lectus gravida mattis";
countries[212] = "Praesent at sapien id lectus dictum vestibulum.";
countries[213] = "Mauris facilisis finibus est, et gravida lacus dignissim malesuada";
countries[214] = "Sed eleifend nibh eget lacus dignissim imperdiet";
countries[215] = "Maecenas a sem interdum, porta augue a, laoreet felis";
countries[216] = "Cras rhoncus, lectus vel porttitor facilisis, ex nunc egestas felis, elementum commodo velit urna et sem";
countries[217] = "In hac habitasse platea dictumst";
countries[218] = "Integer facilisis viverra velit ac maximus";
countries[219] = "Praesent tempor elementum ante, ac iaculis est aliquam et";
countries[220] = "Nam eu eros finibus, lacinia mi ac, fringilla velit.";
countries[221] = "Fusce molestie rhoncus nisi finibus ornare";
countries[222] = "Curabitur laoreet diam sit amet nisi ultricies, eget lobortis mauris elementum";
countries[223] = "Integer facilisis fermentum tincidunt";
countries[224] = "Etiam dapibus odio dui, eget pulvinar sapien vestibulum sit amet";
countries[225] = "Morbi dapibus velit bibendum dui efficitur dignissim";
countries[226] = "Donec eget orci cursus, tincidunt arcu non, accumsan tortor";
countries[227] = "Maecenas vitae nisl lobortis, pharetra neque non, venenatis elit.";
countries[228] = "Sed vitae arcu congue tortor blandit pulvinar eget at arcu";
countries[229] = "Donec id accumsan nulla";
countries[230] = "Vestibulum euismod id dui vitae congue";
countries[231] = "In vehicula at erat vel malesuada";
countries[232] = "Proin sodales ultrices lacus, vitae egestas turpis egestas et";
countries[233] = "Cras bibendum dui et velit gravida, vitae scelerisque tortor feugiat";
countries[234] = "Praesent vel tortor a mauris viverra pretium";
countries[235] = "In sed ipsum purus.";
countries[236] = "Donec sed metus ante";
countries[237] = "Praesent nibh ex, ultricies ac tristique eu, tempus quis lorem";
countries[238] = "Curabitur gravida dui est, id malesuada felis tincidunt et";
countries[239] = "Etiam in consequat lorem";
countries[240] = "Vivamus elementum convallis pharetra";
countries[241] = "Aenean eu erat eu arcu varius pharetra ac a tellus";
countries[242] = "Suspendisse potenti";
countries[243] = "Suspendisse pellentesque dui velit, vitae mollis erat vestibulum id";
countries[244] = "Nam bibendum, ipsum in tempor accumsan, quam dolor sodales leo, nec posuere enim sapien in orci";
countries[245] = "Quisque felis eros, tempus non auctor sit amet, pretium sed enim.";
countries[246] = "Praesent nec magna eros";
countries[247] = "Ut porta hendrerit augue, et ullamcorper magna tincidunt a";
countries[248] = "Sed id nibh neque";
countries[249] = "Ut convallis tortor et auctor mollis";
countries[250] = "Integer auctor magna et ipsum commodo varius";
countries[251] = "Integer a mattis dui";
countries[252] = "Vivamus id arcu commodo, sagittis arcu non, condimentum dui";
countries[253] = "Maecenas dignissim, turpis non interdum imperdiet, sapien nibh mattis metus, at luctus odio purus et eros";
countries[254] = "Nunc a mollis augue";
countries[255] = "Sed quis feugiat dolor";
countries[256] = "Sed laoreet vitae magna ullamcorper dapibus";
countries[257] = "In efficitur sapien turpis, a accumsan elit volutpat eget";
countries[258] = "In eu mi eget tellus dignissim volutpat sit amet placerat augue";
countries[259] = "Aenean interdum nisi eu consequat vulputate";
countries[260] = "Integer ac nisl libero";
countries[261] = "Mauris sit amet porttitor eros.";
countries[262] = "Mauris sagittis massa sit amet orci vehicula malesuada";
countries[263] = "Nunc consequat placerat blandit";
countries[264] = "Ut massa tortor, gravida sed nunc id, vehicula porta tellus";
countries[265] = "Suspendisse et tortor arcu";
countries[266] = "Aliquam quis accumsan lacus";
countries[267] = "Pellentesque consectetur lobortis libero";
countries[268] = "Etiam efficitur est molestie massa dapibus pellentesque";
countries[269] = "Vestibulum interdum blandit odio ac varius";
countries[270] = "Curabitur ut justo semper, suscipit nisl vitae, placerat est";
countries[271] = "Nam laoreet sem a magna pharetra, id pharetra nisi vehicula";
countries[272] = "Nam fringilla ornare eros at condimentum";
countries[273] = "Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas";
countries[274] = "Proin id consequat lorem, sed viverra leo";
countries[275] = "Suspendisse dictum lacus ac sollicitudin sagittis";
countries[276] = "Vestibulum molestie facilisis enim id rhoncus";
countries[277] = "Aenean sed felis ligula.";
countries[278] = "Phasellus congue ante arcu, quis maximus nisi lobortis eget";
countries[279] = "Suspendisse at aliquet nibh";
countries[280] = "Vivamus tempor at nisi ac gravida";
countries[281] = "Nunc risus neque, tempus vel convallis mollis, faucibus a augue";
countries[282] = "Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos";
countries[283] = "Vivamus nec nibh vel lectus posuere rhoncus vitae at quam";
countries[284] = "Pellentesque vulputate feugiat ex vitae fringilla";
countries[285] = "Ut pretium condimentum sem";
countries[286] = "Nulla facilisi";
countries[287] = "Vestibulum diam velit, tincidunt sed suscipit eu, vehicula aliquam enim";
countries[288] = "Etiam fermentum gravida libero vitae iaculis";
countries[289] = "Curabitur ullamcorper cursus est quis mollis";
countries[290] = "Cras non justo ac nisi commodo blandit cursus facilisis nulla";
countries[291] = "Etiam posuere tempus rutrum";
countries[292] = "Sed porttitor eu leo et eleifend.";
countries[293] = "Phasellus id ipsum ullamcorper, tincidunt ipsum faucibus, vestibulum justo";
countries[294] = "Morbi ac purus tincidunt, bibendum quam nec, dapibus felis";
countries[295] = "Praesent fringilla dictum commodo";
countries[296] = "Phasellus ut convallis elit, non aliquam diam";
countries[297] = "Praesent fringilla luctus felis, in ornare leo gravida a";
countries[298] = "Suspendisse id dui a dui interdum egestas";
countries[299] = "Phasellus rutrum, purus nec posuere semper, nisi eros condimentum enim, quis suscipit quam lorem ac neque";
countries[300] = "Mauris facilisis, neque non vehicula eleifend, est ligula ullamcorper lectus, eu convallis diam augue vitae nulla";
countries[301] = "Praesent blandit turpis vel augue sagittis rutrum";
countries[302] = "Nulla a laoreet ligula";
countries[303] = "Fusce iaculis magna quis ante accumsan, vel lobortis dolor vulputate";
countries[304] = "Curabitur mollis eget dui vel tempor";
countries[305] = "Vestibulum placerat ultricies nunc, blandit bibendum arcu ultricies id";
countries[306] = "Integer sit amet egestas nisl, vel gravida justo.";
countries[307] = "Sed at varius nisi";
countries[308] = "Phasellus sit amet purus in odio bibendum ultrices in a turpis";
countries[309] = "Maecenas sollicitudin posuere sapien vel semper";
countries[310] = "Maecenas vitae nunc rhoncus, placerat orci sit amet, porttitor urna";
countries[311] = "Maecenas feugiat nibh est, porttitor sagittis erat commodo vitae";
countries[312] = "Proin tincidunt eget risus at ultrices";
countries[313] = "Vestibulum interdum mi vel massa aliquam elementum";
countries[314] = "Donec et tellus id elit pretium ultricies a ac nunc";
countries[315] = "Ut elementum risus eu eleifend suscipit";
countries[316] = "Vivamus convallis mi pretium urna efficitur, nec aliquet lorem tristique";
countries[317] = "Donec ac metus erat";
countries[318] = "Donec eget tempus ipsum, in tempor purus";
countries[319] = "Phasellus lobortis eu nulla vitae varius";
countries[320] = "Ut luctus tempus varius";
countries[321] = "Donec commodo, ante ut facilisis bibendum, quam urna faucibus justo, ac cursus sapien lorem id nunc";
countries[322] = "Curabitur vitae pharetra ligula, eu ornare leo.";
countries[323] = "Sed condimentum et neque eu congue";
countries[324] = "Fusce sem dui, consectetur et pharetra nec, tempus eget quam";
countries[325] = "Fusce fermentum justo sem, et suscipit augue aliquet a";
countries[326] = "Suspendisse in felis nec ipsum placerat fermentum at sit amet magna";
countries[327] = "In vulputate ligula tortor, vitae cursus erat convallis eget";
countries[328] = "Phasellus interdum erat in lectus dapibus, ut aliquam tellus eleifend";
countries[329] = "Etiam finibus ante eu felis aliquam, at dapibus ante consectetur";
countries[330] = "Proin dui ipsum, vehicula et feugiat eget, dignissim ac lectus";
countries[331] = "Nam ut pellentesque lectus";
countries[332] = "Nulla nunc velit, convallis posuere diam ut, suscipit imperdiet metus.";
countries[333] = "Nunc in leo nec mi ultrices mattis vitae rhoncus felis";
countries[334] = "Suspendisse potenti";
countries[335] = "Suspendisse id porta arcu";
countries[336] = "Donec sed nibh non mi eleifend porta";
countries[337] = "In vulputate fringilla nisl, blandit faucibus ligula volutpat sit amet";
countries[338] = "Aenean consequat commodo sapien, pulvinar posuere lectus efficitur eu";
countries[339] = "Phasellus elementum neque nec tristique faucibus";
countries[340] = "Quisque vitae arcu quis enim tristique vestibulum";
countries[341] = "In sed ex augue.";
countries[342] = "Sed vulputate sed turpis non porttitor";
countries[343] = "Maecenas commodo condimentum arcu ultricies accumsan";
countries[344] = "Phasellus et tristique metus, a volutpat nunc";
countries[345] = "Aliquam est felis, posuere quis ante id, rhoncus imperdiet lorem";
countries[346] = "Phasellus sapien magna, gravida eu pulvinar vel, bibendum nec est";
countries[347] = "Etiam ornare, ligula vel fringilla placerat, turpis lacus aliquet eros, sit amet pellentesque tellus tortor vitae libero";
countries[348] = "Aenean venenatis erat lectus, eu semper massa porttitor in";
countries[349] = "Sed vel nulla ipsum";
countries[350] = "Proin id tellus rhoncus, ultrices enim eu, tincidunt ipsum";

var filteredList = [];
var answerElement = document.getElementById("answer");
var timeElement = document.getElementById("time");
var startTime = 0;

function searchString(query) {
  filteredList = [];
  
  startTime = new Date().getTime();
  
  if (query !== '') {
    const lq = query.toLowerCase();

    for (var i = 0; i < countries .length; i++) {
      if (countries[i].toLowerCase().indexOf(lq) > -1)
        filteredList.push(countries[i]);
    }
  }
  
  timeElement.innerHTML = new Date().getTime() - startTime + ' milliseconds';

  answerElement.innerHTML = '<p>' + filteredList.join('</p><p>') + '</p>';
}

＆＃13;

<input type="text" onkeyup="searchString(this.value)"/>

<p id="time">Type in input above</p>

<div id="answer"></div>

＆＃13;

如何加快这种过滤方法？

4 个答案: