如何使用对象值替换javascript字符串中的特定部分

Question

I want to make custom replacer method for my HTML output. But I can't figure it out. I guess it should be done with String.match and replace somehow.

I have some "error codes" in my string that always start with _err_ and I have a JS object with values.

What I want to achieve:

1. Find all string parts (error codes) that starts with _err_
2. Get correct key for my object - error code without _err_
3. Find value from Lang object
4. Replace error code with correct Lang value.

Some error codes may appear multiple times.

var content = "Looks like you have _err_no_email or _err_no_code provided";
var Lang = {
    'no_email' : "No email",
    'no_code' : "No code"
};

I can do it other way around. So I cycle the Lang object and replace those in string. It would be something like this if using underscore:

function replaceMe() {
    _.each(Lang, function(value, key) {
        content = content.replace(new RegExp('_err_' + key,'g'), value);
    });
    console.log(content);
};

But if it can be done faster with my first idea then I want to know how.

Answer 1

A simple regex should do the trick:

var content = content.replace(/\b_err_(.+?)\b/g, function(match, errorName) {
    return Lang[errorName] || match;
});

This assumes that you do not want strings like "blah_err_blah" to be replaced, and defaults to not replacing the text if the error cannot be found in your Lang object.

Answer 2

var replace = function(str, object, regexp) { //if property not found string is not replaced
    return String(str).replace(regexp || (/\\?\{([^{}]+)\}/g), function(match, name) {
        return (object[name] != null) ? object[name] : match;
    });
}

This is a format function I've used in several projects thats quite efficient. Matches {prop} by default to {prop:'val'} but you can pass a regex for example maybe in your case /_err_+\\S/g so it matches other tokens in your string.

So you can do:

var content ="Looks like you have {no_email} or {no_code} provided";
var Lang = {
    'no_email' : "No email",
    'no_code' : "No code"
}

var formatted = replace(content, lang);

Or for your original string stealing the other answers regex:

var formatted = replace(content, lang, /_err_([^\s]+)/g)

Answer 3

You can use a callback function, that look if a key matching the error code exists in your Lang object, and if so returns the value of that (and otherwise just the key itself, thereby doing no replacement, like so:

content.replace(/_err_([a-z_]+)/gi, function(fullmatch, key) {
  return Lang[key] ? Lang[key] : fullmatch;
});

The first parameter passed to the function will be the full match, and the second parameter key will just be that part grouped by the bracktes.

And then, if Lang contains a (non-falsy) value for key , that'll be returned, otherwise just the fullmatch value, so that that part of the string gets “replaced” with itself.

See it in action here: http://jsfiddle.net/VZVLt/1/

Answer 4

One more variation with split

content = content
        .split('_err_')
        .map(function(str, index){
            if (index === 0) 
                return str;

            var whitespace = str.indexOf(' '),
                key = str.substring(0, whitespace)

            return Lang[key] + str.substring(whitespace);
        })
        .join('')
        ;