stringObject.replace()方法第二个参数为函数时,其参数根据前面匹配规则变动。
eg1:
var str = 'good good study, day day up.';
var reg = /o/g;
str.replace(reg,function(){
console.log(arguments);
});
// ["o", 1, "good good study, day day up."]
// ["o", 2, "good good study, day day up."]
// ["o", 6, "good good study, day day up."]
// ["o", 7, "good good study, day day up."]
// 方法执行结果:"gundefinedundefinedd gundefinedundefinedd study, day day up."
例一中,生成替换文本的函数有三个参数,参数1是匹配字符串,参数2是匹配的位置,最后一个是整个进行匹配的字符串str。
eg2:
var str = '{good} {good} study, day day up.';
var reg = /\{(good)\}/g;
str.replace(reg,function(){
console.log(arguments);
});
// ["{good}", "good", 0, "{good} {good} study, day day up."]
// ["{good}", "good", 7, "{good} {good} study, day day up."]
// 方法执行结果:"undefined undefined study, day day up."
例二中,我们匹配'{good}',带大括号的good,这个返回替换文本函数有四个参数,参数1是匹配的字符串,参数2是匹配的单元1('(good)')的单元内的规则值'good',参数3是匹配字符串在整个字符串中的起始索引位置。最后一个同样是整个进行匹配的字符串str。
以上可得,在这个返回替换文本的函数里,参数个数根据替换匹配规则来变,如果规则中有子单元,函数的第一个参数则是匹配的结果,后面的参数依次是匹配规则中的子单元字符串,再后面接着匹配结果字符串的索引起始位置和整个进行匹配的字符串str。
实际应用案例,模板原理。
eg3:
var data = {"name":"傅小椿"}; // 模拟数据
var template = '你好,我是{name}!'; // 模板
/**
* 模板解析方法
* @param {[string]} template [模板字符串]
* @param {[json]} data [要绑定到模板的数据]
* @return {[string]} [返回模板解析后的字符串]
*/
function format(template,data){
var reg = /\{(\w+)\}/g;
return template.replace(reg, function(match,u1){
return data[u1];
});
}
/* replace方法的第二个参数返回替换文本函数,
其第一个参数match是匹配到的字符串,
u1是匹配规则中单元1内的字符串。
format函数需要的就是和data对应的单元内字符串。
*/
// 把解析好的模板放到页面结构中。
var html = format(template,data);
document.getElementById('box').innerHTML = html;
That's all.
转载请注明带链来源:春语精椿