Javascript regex replace yields unexpected result

Question

I have this strange issue, hope that someone will explain what is going on.

My intention is to capture the textual part (a-z, hyphen, underscore) and append the numeric values of id and v to it, underscore separated.

My code:

var str_1 = 'foo1_2';
var str_2 = 'foo-bar1_2';
var str_3 = 'foo_baz1_2';
var id = 3;
var v = 2;
str_1 = str_1.replace(/([a-z_-]+)\d+/,'$1' + id + '_' + v);
str_2 = str_2.replace(/([a-z_-]+)\d+/,'$1' + id + '_' + v);
str_3 = str_3.replace(/([a-z_-]+)\d+/,'$1' + id + '_' + v);

$('#test').html(str_1 + '<br>' + str_2 + '<br>' + str_3 + '<br>');

Expected result:

foo3_2
foo-bar3_2
foo_baz3_2

Actual Result:

foo3_2_2
foo-bar3_2_2
foo_baz3_2_2

Any ideas?

JS Fiddle example

Pointy · Accepted Answer · 2015-08-25 12:31:17Z

4

Your pattern:

/([a-z_-]+)\d+/

matches only "foo1" in "foo1_2", and "foo" will be the value of the captured group. The .replace() function replaces the portion of the source string that was actually matched, leaving the remainder alone. Thus "foo1" is replaced by "foo3_2", but the original trailing "_2" is still there as well.

If you want to alter the entire string, then your regular expression will have to account for everything in the source strings.

answered Aug 25, 2015 at 12:31

Pointy

415k62 gold badges600 silver badges631 bronze badges

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

1 Comment

B-and-P Over a year ago

Ah! I feel so stupid right now.. knew it was something obvious. Thank you.

hsz · Accepted Answer · 2015-08-25 12:33:37Z

0

Just try with:

str_1 = str_1.match(/([a-z_-]+)\d+/)[1] + id + '_' + v;

answered Aug 25, 2015 at 12:33

hsz

153k63 gold badges269 silver badges320 bronze badges

Comments

Pieter21 · Accepted Answer · 2015-08-25 12:35:31Z

0

Use this instead to capture 1_2 completely:

str_1 = str_1.replace(/([a-z_-]+)\d+_\d+/,'$1' + id + '_' + v);

answered Aug 25, 2015 at 12:35

Pieter21

1,8451 gold badge11 silver badges23 bronze badges

Comments

Manwal · Accepted Answer · 2015-08-25 12:37:18Z

0

Because you want to replace _2 also of string. Solution can be this:

str_1 = str_1.replace(/([a-z_-]+)\d+_\d/,'$1' + id + '_' + v);
str_2 = str_2.replace(/([a-z_-]+)\d+_\d/,'$1' + id + '_' + v);
str_3 = str_3.replace(/([a-z_-]+)\d+_\d/,'$1' + id + '_' + v);

DEMO

answered Aug 25, 2015 at 12:37

Manwal

23.9k15 gold badges65 silver badges95 bronze badges

1 Comment

B-and-P Over a year ago

thank you, I got it figured. @Pointy beat you to it.

parameciostudio · Accepted Answer · 2015-08-25 12:46:08Z

0

Your pattern actually includes the first digits, but it will store only the textual part into $1:

foo1_2

([a-z_-]+)\d+   = foo1
$1              = foo

The pattern stops searching at the first digits of the string. if you want to replace any characters after the textual part, you could use this pattern:

/([a-z_-]+)\d+.*/

answered Aug 25, 2015 at 12:46

parameciostudio

5905 silver badges13 bronze badges

Collectives™ on Stack Overflow

Javascript regex replace yields unexpected result

5 Answers 5

1 Comment

Comments

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related