Variable in RegEx - Turns RegEx Syntax to String - How to avoid?

Question

in the following Snippet (Example) you can see that I tried to build a function for more comfortable string-replacements in my project.

Really soon I found out that it's necessary to connect the regex-syntax with a variable, and found this regEx-Objekt solution in this topic.

But after hours of try(outs), I realized that my this solution didn't really worked, because it converts the slashes to a string, and at the end we have a simple string again.

The following example focused a URL to replace. I like this example, because we have the Slashes in out pattern and input:

function replaceThis(valInput, valPattern, valReplace) {

  var regex = new RegExp('/' + valPattern + '/', "g");
  return valInput.replace(regex, valReplace);
}

example_input = 'http://localhost/images/important.jpg';
example_target = '/Applications/AMPPS/www/';
example_pattern = 'http:\/\/localhost\/';

// With Function
$('#a').html('[RESULT 1] ' + replaceThis(example_input, example_pattern, example_target));

// With Strings (without Function)
$('#b').html('[RESULT 2] ' + 'http://localhost/images/important.jpg'.replace(/http:\/\/localhost\//g, '/Applications/AMPPS/www/'));

p {
  font-family: verdana;
  margin: 2p 5px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="a">a</p>
<p id="b">b</p>

You can see:

var regex = new RegExp('/' + valPattern + '/', "g");

Which should lookup for a string like:

'/http://localhost//g'

Not liked assumed/wished:

/http://localhost//g

Which should lookup for a string like:

'http://localhost/'

Any ideas how to handle/solve this? I'm working since hours on that.

Jared Price · Answer 1 · 2015-04-09T22:18:28.247

1

Why do you need a regex at all? Why not just replace a string like so?:

var input = 'http://localhost/images/important.jpg';
var pattern = 'http://localhost/';

var output = input.replace(pattern, '/Applications/AMPPS/www/');
console.log(output); // /Applications/AMPPS/www/images/important.jpg

edited Apr 09 '15 at 22:18

answered Apr 09 '15 at 22:05

Jared Price

5,217
7
44
74

Unfortunately, string replace does not do global replacements. – Tomalak Apr 09 '15 at 22:23
Ahh... that makes sense. Still though, will he ever have more than one instance of `http://localhost/` in his string? – Jared Price Apr 09 '15 at 22:27
Yes... the real function is a little bit bigger and made for filtering and replacing for different parts of code. One of them is a filter for links and bad-words. But thanks to Omar, the problem was solved. – Sascha Apr 10 '15 at 18:08
Well I'm glad you figured it out. Keep on coding! – Jared Price Apr 10 '15 at 18:40

score 1 · Accepted Answer · answered Apr 09 '15 at 22:08

1

when you use RegExp Object notation, pass first argument as the pattern without / and second argument as the flags.

and double escape it.

so /\w{0,9}/g will be new RegExp('\\w{0,9}','g');

so your function will be:

function replaceThis(valInput, valPattern, valReplace) {

  var regex = new RegExp(valPattern , "g");
  return valInput.replace(regex, valReplace);
}

answered Apr 09 '15 at 22:08

Omar Elawady

3,300
1
13
17

Thank you... that helped a lot and solved my issue. The double-escape hint was a nice addition to. Because after that the function (which was related to the example above) got a scipt-tag filter where more parameters and these double escapes was necessary to use in a RegExp Object. – Sascha Apr 10 '15 at 18:06
@Sascha Hint: Use [RegExp.quote()](http://stackoverflow.com/a/2593661/18771) to make strings safe for use in regular expressions. – Tomalak Apr 11 '15 at 09:53

Variable in RegEx - Turns RegEx Syntax to String - How to avoid?

2 Answers2