RegExp to match a string in JavaScript

Question

Currently I am using an autocomplete box within an HTML form.

where "val" contains the contents of the text field:

for (i = 0; i < arr.length; i++) 
{
     if (arr[i].substr(0, val.length).toUpperCase() == val.toUpperCase()) 
     {
     ...code to create drop down list...
     }

}

But this only works with matching patterns from the start. Would like to use RegEx instead to select any array items that contain val anywhere in the array.

I have tried

var results = arr[i].match(/val/i);
if (var)…

But obviously that has failed.

Obviously I could modify the second if statement to loop through the entire length of the array variable, but that would be a waste of time.

Can someone help me with the current usuage?

can you show us input and expected output, to me it's not so clear as the regex you have written should work. even though it will match only one instance — Code Maniac
– Code Maniac, Commented Mar 25, 2019 at 16:31
@ponury-kostek, hopefully val doesn't contain any regular expressions metacharacters — user21926
– user21926, Commented Mar 25, 2019 at 17:20
@ponury-kostek Is it possible that var results = arr[i].match(new RegExp(val, 'i')); only matches at the beginning of the string? I need it to match anywhere. — Daniel Kaplan
– Daniel Kaplan, Commented Mar 25, 2019 at 17:39

3limin4t0r · Accepted Answer · 2019-03-27 19:49:57Z

1

You can simply loop through your array with Array.prototype.filter to filter out the unwanted elements. Using the RegExp constructor to dynamically create a regex from a given value.

var regex = new RegExp(val, 'i');

arr.filter(str => str.match(regex))
   .forEach(str => {
     // everything here matches the regex
     // ... code to create drop down list ...
   });

Note that this does allow the user to also type regex in the input box. If you want to take their input literal you'll have to escape the special regex characters.

Alternatively you could also use the String.prototype.includes method if you are searching for a literal match.

var upVal = val.toUpperCase();
arr.filter(str => str.toUpperCase().includes(upVal));

If your arr is a NodeList convert it to an array first using Array.from.

edited Mar 27, 2019 at 19:49

answered Mar 25, 2019 at 16:32

3limin4t0r

21.4k3 gold badges38 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

3limin4t0r Over a year ago

I've assigned new RegExp(val, 'i') to a variable to avoid re-instantiating the same regex inside the .filter loop. eg. .filter(item => item.match(new RegExp(val, 'i'))) will instantiate a new regex for every item you're trying to match.

Daniel Kaplan Over a year ago

Thanks for this, I believe it is the best way. but within each loop how do I get the full string? Is it part of item?

3limin4t0r Over a year ago

@DanielKaplan item is the string, I'll update the answer to better reflect this.

mbojko · Accepted Answer · 2019-03-27 19:56:20Z

1

If you don't care about Internet Explorer (or if you do and use polyfills), there's the String.prototype.includes method. So simply

if arr[i].toUpperCase().includes(val.toUpperCase()) //...

answered Mar 27, 2019 at 19:56

mbojko

14.8k2 gold badges21 silver badges28 bronze badges

Collectives™ on Stack Overflow

RegExp to match a string in JavaScript

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related