Match a string with an array

Question

I have an array like this...

var array = ['aaa', 'bb', 'ccc', 'dddd', 'eee', 'fff'];

Also, I have a string like this:

5000aaa

or like this...

50bb

That string will vary, I need to put that matching part (aaa) into a variable and remove it from the existing string.

The final result should be like this:

var array = ['aaa', 'bb', 'ccc', 'dddd', 'eee', 'fff'];
var oldString = '5000aaa';
var matchedPart = 'aaa';
var newString = '5000';

Problem is the matching length is varied, And the string is dynamic (Getting from an input's value) However, every time the matching part only included in the end.

I can't figure out how to do this with pure Javascript or with ES2015 or VueJS. Can anyone guide me?

You can use [`String.prototype.replace()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace) for that. — pishpish, Feb 24 '19 at 15:25
could you have more than one item of the array in the string? — Nina Scholz, Feb 24 '19 at 15:28

score 2 · Answer 1 · answered Feb 24 '19 at 15:26

One way would be to use a regular expression with an alternation and capture groups, like this:

var regex = new RegExp("(\\d+)(" + array.join("|") + ")");

| defines a series of alternatives, any of which is allowed to match. So for example:

var array = ['aaa', 'bb', 'ccc', 'dddd', 'eee', 'fff'];
var regex = new RegExp("(\\d+)(" + array.join("|") + ")");
var str = "500bb";
var match = regex.exec(str);
console.log(match[1]); // 1st capture group: "500"
console.log(match[2]); // 2nd capture group: "bb"

Note: If the text in the array can have any characters that have special meaning in regular expressions (like | or ? or .), you'll need to escape those when passing them to the RegExp constructor. There are various ways to do that in this question's answers. You'd apply it to the above like this:

var regex = new RegExp("(\\d+)(" + array.map(function(entry) {
    return rexEscape(entry);
}).join("|") + ")");

...where rexEscape is whatever escape function you end up defining and using.

score 1 · Accepted Answer · answered Feb 24 '19 at 15:27

You could store the replaced string and use a regular expression with optional patterns for searching.

var array = ['aaa', 'bb', 'ccc', 'dddd', 'eee', 'fff'],
    replaced,
    string = '5000aaa',
    newString = string.replace(new RegExp(array.join('|')), s => (replaced = s, ''));

console.log(replaced);
console.log(newString);

score 0 · Answer 3 · answered Feb 24 '19 at 15:50

You could use a forEach loop to loop through the array, create a regex that matches only the array, and if it matches, return it.

let array = ['aaa', 'bb', 'ccc', 'dddd', 'eee', 'fff'];
let oldString = "5000aaa";
let matchedPart;
let newString;
let re;

array.forEach((e) => {
  re = new RegExp(e, "g");
  if (oldString.match(re) != null) {
    matchedPart = oldString.match(re).join('');
    newString = oldString.replace(re, '');
  }
});

console.log(newString);
console.log(matchedPart);

score 0 · Answer 4 · answered Feb 24 '19 at 16:04

It can be done using simple Array and String prototypes. It can be done maybe more easier way using tons of regex but I personally avoid regex like its plague. Here is example:

function filterWord(oldString) {

  // Words that need to be left removed
  const arrayOfWords = ['aaa', 'bbb', 'ccc']

  // Filter though those words
  const filterWord = arrayOfWords.filter(function(word) {

    // Does string of aray include oldString?
    if (oldString.includes(word)) return word;
  });

  // If there was no match in filtering, 0 index will be undefined
  const matchedWord = filterWord[0] || false;

  // If there where no matchs, return false
  if (!matchedWord) return false;

  // Remove forbiden part from oldString with string.replace
  const newString = oldString.replace(new RegExp(matchedWord,"g"), "");

  return  {
    oldString: oldString,
    matchedPart: matchedWord,
    newString: newString
  }

}

console.log(filterWord('500aaa'));

score 0 · Answer 5 · answered Feb 24 '19 at 16:16

You can simply use regex to solve your problem.

 var array = ['aaa', 'bb', 'ccc', 'dddd', 'eee', 'fff'];
    var oldString = "5000aaa";
    var regexStr = oldString.match(/[a-z]+|[^a-z]+/g); 

    console.log({"oldString": oldString,
    "matchedPart": regexStr[1],
    "newString": regexStr[0]});

score 0 · Answer 6 · answered Feb 24 '19 at 22:52

If the patterns are simple strings always located at the end, then I don't think you need regular expressions for this.

I would create a function splitFunction which takes an array of patterns and return a function which takes a string and checks if it ends with one the patterns. It returns an array with the new string and the matched pattern.

By returning an array, you can then use destructuring assignment.

const splitFunction = patterns => str => {
  const pattern = patterns.find(p => str.endsWith(p));
  return !pattern ? [] : [str.slice(0, -pattern.length), pattern];
};

const split = splitFunction(['aaa', 'bb', 'ccc', 'dddd', 'eee', 'fff']);

const [newString, match] = split('500aaa');

console.log(newString, match);

Match a string with an array

6 Answers6