2
votes

In the frontend there is a list of game titles that consist of strings:

id, game name, date, price The search shall accept multiple keywords, e.g. user might type: 1998 Streetfighter 2 or Streetfighter 1998 Currently I create an array separated by empty space, that creates 3 keywords: [1998, Streetfighter , 2 ] Then I go through the collection of game titles to filter matches. unfortunately it also gives back any title that includes "2" because there is no pattern recognition that identifies "Streetfighter 2" belongs together. Is there a simple algorithm to provide a pattern search?

const allGames = [
"Streetfighter 1, 1992, 20",
"Streetfighter 2, 1998, 20",
"pokemon, 2016, 20",
"Diablo 3, 2015, 40",
"Super mario, 1995, 20",
"The Witcher, 2012, 20",
]
1
Note that Super Mario was released in 1985, not 1995Cid
because there is no pattern recognition that identifies "Streetfighter 2" belongs together So are you saying you only want to match the whole string and not just parts of it?StudioTime
use array of objects,so that you have particular keys you can traverse ,match or filter out.something like const allGames=[{name:"Streetfighter 2",releaseDate:"20-12-1992"}] for release date use Date object,i recommend,so that if you have thousands of games ,you can filter one using unique release date or namewarmachine

1 Answers

1
votes

Your search query looks advanced enough to justify using a search engine. Just don't create one yourself (it's harder than you may think).

In this answer I'll be using Lunr.js

Here's a 2min crash course:

  1. Transform your data into documents. (I've already converted your initial allGames array.)

  2. Then create a search index where you:

    1. Specify which property of a document holds a unique identifier. (In our case title.)
    2. Define which properties should be indexed. (In our case all of them.)
    3. Define a boost score for each property. (i.e a match in the title has a higher relevance score than a match in the price.)
  3. Add all documents to the search index.

  4. Search! ;)


📢 Search Query FTW!

Notice the last search, I'm using a wildcard in the search string (street*) to find the two Street Fighter titles!


const createLunrIndex = docs =>
  lunr(function () {
    this.ref('title');
    this.field('title', 5);
    this.field('date', 3);
    this.field('price', 1);
    for (doc of docs) this.add(doc);
  });

const search = (lunrIndex, term) =>
  lunrIndex
    .search(term)
    .map(res => res.ref)
    
const gamesIndex = createLunrIndex(allGames);

console.log(
  search(gamesIndex, '1998 Streetfighter 2')
);

console.log(
  search(gamesIndex, 'Streetfighter 1998')
);

console.log(
  search(gamesIndex, 'street*')
);
<script src="https://unpkg.com/lunr/lunr.js"></script>
<script>
const allGames =
  [ { "title": "Streetfighter 1"
    , "date": "1992"
    , "price": "20"
    }
    ,
    { "title": "Streetfighter 2"
    , "date": "1998"
    , "price": "20"
    }
    ,
    { "title": "pokemon"
    , "date": "2016"
    , "price": "20"
    }
    ,
    { "title": "Diablo 3"
    , "date": "2015"
    , "price": "40"
    }
    ,
    { "title": "Super mario"
    , "date": "1985"
    , "price": "20"
    }
    ,
    { "title": "The Witcher"
    , "date": "2012"
    , "price": "20"
    }
  ]
</script>