匹配数组中的值并替换字符串

时间:2015-02-12 18:56:10

标签: javascript arrays

我试图为图像构建一个小转换器“html to BBcode”,我需要帮助!

例如字符串:

var str = 'Hello ! <img src="/pathHere/party.png"><img src="/pathHere/sun.png">';

我正在做一个regEx来查找字符串中是否有任何图像

var reg = new RegExp(/(\w+)\.(jpg|png|gif)/gi);
var matches = str.match(reg);
console.log(matches);

在这个例子中,它会给我一个arraylike这个:

["party.png", "sun.png"]

我有一个关联数组,如:

var itemsToConvert = {
    'party.png' : ':party:',
    'sun.png'   : ':sun:',
    'cloud.png' : ':cloud:',
}

我想要实现的目标:

  • 根据 itemsToConvert 数组的键
  • 检查匹配数组的每个值
  • 如果它们相同,我想用新值替换字符串

所以,在这个例子中,我的字符串将是

var convertedString = 'Hello ! :party: :sun.png:'

非常感谢任何帮助。

由于

2 个答案:

答案 0 :(得分:1)

最好的办法是使用Underscore JS。有很多方法可以做这种事情。例如,您的问题可以通过以下方式解决:

matches = ["party.png", "sun.png"];
var itemsToConvert = {
    'party.png' : ':party:',
    'sun.png'   : ':sun:',
    'cloud.png' : ':cloud:',
};

// Extract the keys from the associative array
var keys = _.keys(itemsToConvert);

var toConvertString = "Hello ! party.png  sun.png ";

var convertedString = toConvertString;

// For each key, replace any matches with the value from the associative array
_.each(keys, function(key) {
    var value = itemsToConvert[key];
    convertedString = convertedString.replace(key, value);
});

console.log(convertedString);  // <<== returns "Hello ! :party:  :sun: "

这与您请求的字符串不完全匹配,但我不完全确定从哪里获取关联数组。希望它能让你足够接近。

答案 1 :(得分:1)

使用普通的javascript:

var str = 'Hello ! <img src="/pathHere/party.png"><img src="/pathHere/sun.png">';
var matches = str.match(new RegExp(/(\w+)\.(jpg|png|gif)/gi));
var itemsToConvert = {
    'party.png' : ':party:',
    'sun.png'   : ':sun:',
    'cloud.png' : ':cloud:',
}

for (m in matches) {
    m = matches[m];
    if (itemsToConvert[m] !== undefined) {
        var r = new RegExp("<img(.*?)" + m + "\\\">");
        str = str.replace(r, itemsToConvert[m]);
    }
}

console.log(str);

// Output: Hello ! :party::sun:

如果您愿意,可以在代码之间添加空格。