How to replace several different items in a template text document in JavaScript

Question

I am trying to create a service where an email is sent after an http request is made. I have several variables defined within the text of the document, something like #FIRSTNAME #LASTNAME etc. and after an even I want to replace these with information received by the post (i.e. dynamically and not prior known variables).

The current method I am using involved a regex method of

matcha = /#FIRSTNAME/
matchb = /#LASTNAME/

But after only those two emails I have a pretty long code string that looks like:

 let outgoingEmail = data.replace(matcha, vara).replace(matchb, varb)

Is there a more concise way to replace several matches or do I have to just chain all of the matches together?

With two I guess this is tolerable but I would like to replace many and I am wondering how things like email templating services typically handle this.

This looks very similar to another question that I posted several years ago. — Anderson Green
– Anderson Green, Commented Dec 21, 2016 at 3:48

Tushar · Accepted Answer · 2016-12-30 04:43:40Z

2

Create an object to store the needles and their replacement. Using Object.keys() to get all the keys in the object and RegExp constructor, create a regex with OR | in the keys.

Then use String#replace with function to replace the needles by their values from the object.

var replacements = {
    '#FIRSTNAME': 'Tushar',
    '#LASTNAME': 'Secret'
    ...
};

var regex = new RegExp(Object.keys(replacements).join('|'), 'g');
// Use `i` flag to match case-insensitively

data.replace(regex, function(m) {
    return replacements[m] || m;
});

Note: If the string to find contains characters having special meaning in regex, they need to be escaped before creating regex from string.

edited Dec 30, 2016 at 4:43

answered Dec 21, 2016 at 3:45

Tushar

87.4k21 gold badges164 silver badges182 bronze badges

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

4 Comments

Startec Over a year ago

This looks great, but I updated my answer, I am looking for a version that can use dynamic variables. Here Tushar and secret are hard coded.

Tushar Over a year ago

@Startec You can assign the values when creating object. As you've variables, you can use those as values in object.

Startec Over a year ago

don't I have to pass in replacements to Object.keys()?

Tushar Over a year ago

@Startec sorry, my mistake. Thanks for correcting me. :)

Alexander O'Mara · Accepted Answer · 2016-12-21 03:51:57Z

1

You can make a basic template engine rather easily if you use .replace with a callback function, and supply an object with variable names.

Simple Example:

var data = '\n' +
	'firstname:  #FIRSTNAME\n' +
	'lastname: #LASTNAME\n' +
	'\n';

var replace = {
	FIRSTNAME: 'John',
	LASTNAME: 'Smith'
};

var message = data.replace(/#([A-Z]+)/g, function(all, word) {
	return replace[word];
});

console.log(message);

The regex I used will match any #'s followed by all-capital-letters. You can adjust it to your needs.

answered Dec 21, 2016 at 3:51

Alexander O'Mara

60.9k19 gold badges176 silver badges184 bronze badges

Collectives™ on Stack Overflow

How to replace several different items in a template text document in JavaScript

2 Answers 2

4 Comments

Simple Example:

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Simple Example:

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related