CODEWITHSUNDEEP
javascriptarraysstring
DijkeMark
DijkeMark

Reputation: 1306

Javascript - Find an replace a part of a string with value from an array

I have an string, but at certain points in the string it has dynamic values. I want to find those points in the string and replace them with values from an array.

Let's say I have:

var array = ['string', 'value'];
var string = 'This is a {1}, and this is a {2}.';

Now I need to figure out a way to replace {1}, with the value of the first index in the array and replace {2} with the value of the second index of the array.

So the string would like this:

This is a string, and this is a value.

This seems so simple, but I am breaking my head on this. I can't find a way to do this easily.

Upvotes: 0

Views: 342

Answers (3)

Matías Fidemraizer
Matías Fidemraizer

Reputation: 64923

You can use Array.prototype.reduce:

var StringHelper = {
  format: function(format, args) {
    return args.reduce(function(result, currentReplace, currentReplaceIndex) {
      result = result.replace("{" + (currentReplaceIndex + 1) + "}", args[currentReplaceIndex]);

      return result;
    }, format);
  }
};

var sourceString = "My name is {1} and I'm {2} years old";
var replaceItems = ["Matías", "31"];

var parsedString = StringHelper.format(sourceString, replaceItems);

alert(parsedString);

It's a good alternative to regular expressions, and I'm not absolutely sure if I did a jsPerf test in the right way, but it shows that this approach outperforms the regular expression one.

Upvotes: 1

Oriol
Oriol

Reputation: 288130

You can use replace with a regular expression and a function:

string.replace(/{(\d+)}/g, function(match, n) {
  return array[n-1];
});

You can also check n < 1 || n > array.length to provide a fallback value in case the number is out of bounds.

Alternatively, the new ES6 way is using tagged template strings

function tag(strings, ...values) {
  var parts = [];
  for(var i=0; i<strings.length; ++i)
    parts.push(strings[i], array[values[i]-1]);
  return parts.join('');
}
tag`This is a ${1}, and this is a ${2}.`

Upvotes: 5

Thomas
Thomas

Reputation: 3593

like this

string.replace(/\{(\d+)\}/g, function(m, n){
  return array[n-1]
})

Upvotes: 1

Related Questions