Javascript根据最接近的匹配对数组进行匹配

Question

I'm implementing a search that gives suggestions based on the query. 我正在实现一个搜索，该搜索根据查询提供建议。 It checks if any of the suggestions includes the query. 它检查是否有任何建议包括查询。 However, the suggestions aren't sorted by the closest match. 但是，建议未按最接近的匹配排序。 How do I sort them? 如何分类？

This is my code: 这是我的代码：

this.suggestions = this.allSuggestions.filter(s => s.Subject.includes(this.query) || s.Child_Subject.includes(this.query))

Answer 1

I just made a sweetScore and SweetSort today. 我今天刚刚制作了sweetScore和SweetSort 。 It hurt my minuscule brain. 它伤了我的小脑。 Hopefully it works for you like it does for me. 希望它对您有用，就像对我一样。

 //<![CDATA[ var doc, M, I, special, unspecial, regEsc, sweetScore, SweetSort; // for use on other loads addEventListener('load', function(){ // make sure DOM is loaded doc = document; M = function(tag){ return doc.createElement(tag); } I = function(id){ return doc.getElementById(id); } special = function(str){ // for use with .innerHTML not .value or .text return str.replace(/&/g, '&amp;').replace(/'/g, '&apos;').replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;'); } unspecial = function(str){ return str.replace(/&amp;/g, '&').replace(/&apos;/g, "'").replace(/&quot;/g, '"').replace(/&lt;/g, '<').replace(/&gt;/g, '>'); } regEsc = function(string){ return string.replace(/[.*+?^()[\\]|{}\\\\$]/g, '\\\\$1'); } sweetScore = function(string){ for(var i=0,str=string.toLowerCase(),s=0,n=1,l=str.length; i<l; i++,n++){ s += Math.pow(str.charCodeAt(i), n); } return s; } SweetSort = function(array){ var stash; this.candy = function(array){ stash = array.slice(); return this; } if(array !== undefined)this.candy(array); this.sweet = function(string){ var str = regEsc(string), score = sweetScore(str), rx = new RegExp('^'+str, 'i'), p = [], r; if(str !== ''){ for(var i=0,l=stash.length; i<l; i++){ if(stash[i].match(rx)){ p.push(stash.splice(i, 1)[0]); i--; l--; } } p.sort(function(a, b){ return a.length-b.length; }); } stash.sort(function(a, b){ return Math.abs(score-sweetScore(a))-Math.abs(score-sweetScore(b)); }); r = p.concat(stash); stash = stash.concat(p); return r; } } var sweet_score_in = I('sweet_score_in'), sweet_sort = I('sweet_score'), sweet_sort_in = I('sweet_sort_in'), sweet_sort = I('sweet_sort'); sweet_score_in.onkeyup = function(){ sweet_score.innerHTML = sweetScore(this.value); } var sm = new SweetSort(['how', 'now', 'brownest', 'Brown', 'Cow']); sweet_sort_in.onkeyup = function(){ sweet_sort.innerHTML = special(JSON.stringify(sm.sweet(this.value.trim()))); } sweet_sort.innerHTML = special(JSON.stringify(sm.sweet(''))); I('content').style.display = 'block'; // in case you are creating other DOM parts with JavaScript });// end load //]]>

 /* external.css */ *{ padding:0; margin:0; box-sizing:border-box; overflow:hidden; } html,body{ width:100%; height:100%; background:#aaa; color:#000; } body{ position:relative; font:22px Tahoma, Geneva, sans-serif; } body>*{ position:absolute; } #content{ display:none; width:100%; height:100%; } .page{ position:relative; width:100%; height:100%; float:left; } .bar{ width:100%; height:38px; padding:3px; background:#ccc; color:#000; } h1{ font-size:28px; margin-left:3px; } .main{ height:calc(100% - 38px); padding:5px; overflow-y:auto; } label{ display:block; height:26px; font-weight:bold; } label>em{ font-size:14px; } input[type=text]{ width:100%; font:22px Tahoma, Geneva; padding:0 5px; border:1px solid #aaa; border-radius:5px; } input[type=text]+div{ height:28px; margin-bottom:5px; }

 <!DOCTYPE html> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'> <head> <meta http-equiv='content-type' content='text/html;charset=utf-8' /> <meta name='viewport' content='width=device-width, height=device-height, initial-scale:1, user-scalable=no' /> <title>sweetScore &amp; SweetSort - by Jason Raymond Buckley</title> <link type='text/css' rel='stylesheet' href='external.css' /> <script type='text/javascript' src='external.js'></script> </head> <body> <div id='content'> <div class='page'> <div class='bar'><h1>sweetScore &amp; SweetSort</h1></div> <div class='main'> <label for='sweet_score_in'>sweetScore</label> <input id='sweet_score_in' type='text' value='' /> <div id='sweet_score'>0</div> <label for='sweet_match_in'>SweetSort <em>['how', 'now', 'brownest', 'Brown', 'Cow']</em></label> <input id='sweet_sort_in' type='text' value='' /> <div id='sweet_sort'></div> </div> </div> </div> </body> </html>

Javascript根据最接近的匹配对数组进行匹配

问题描述

1 个解决方案

解决方案1
0 2019-02-12 03:43:55

Javascript根据最接近的匹配对数组进行匹配

问题描述

1 个解决方案

解决方案1 0 2019-02-12 03:43:55

解决方案1
0 2019-02-12 03:43:55