javascript - 這個正則表達式為什么總是只能替換掉一個字符串??
問題描述
我是想把雙大括號里的包括字符串替換成真正的值,但是總是只能替換掉一個,不知道為什么?
var tpl = ’/cube_xinbao_dial_result/{{report_type}}/{{query}}’;var data = {report_type:1, query: ’2323’}function render(tpl, data){ var re = /{{([^}]+)?}}/g; var match = ’’; while(match = re.exec(tpl)){tpl = tpl.replace(match[0],data[match[1]]); } return tpl;}console.log(render(tpl,data));
問題解答
回答1:ad
回答2:String.replace 也支持正則表達式當作參數哦,給你改寫了一下
var tpl = ’/cube_xinbao_dial_result/{{report_type}}/{{query}}’;var data = {report_type:1, query: ’2323’}function render(tpl, data){ var re = /{{([^}]+)?}}/g; return tpl.replace(re, function($0, $1, $2){if( $1 in data ){ return data[$1];}else{ return '[DATA.'+ $1.toUpperCase() + ']'; //如果沒有,提示標簽錯誤} });}console.log(render(tpl,data));/* /cube_xinbao_dial_result/1/2323*/console.log(render(tpl,{query:1234}));/* /cube_xinbao_dial_result/[DATA.REPORT_TYPE]/1234*/
如果執意要使用你原來的方式,需要取消掉全局參數g
var tpl = ’/cube_xinbao_dial_result/{{report_type}}/{{query}}’;var data = {report_type:1, query: ’2323’}function render(tpl, data){ var re = /{{([^}]+)?}}/; //不要全局匹配就可以 var match = ’’; while(match = re.exec(tpl)){tpl = tpl.replace(match[0],data[match[1]]); } return tpl;}console.log(render(tpl,data));/* /cube_xinbao_dial_result/1/2323*/回答3:
RegExp對象,有個屬性,lastIndex,代表一個整數,標示開始下一次匹配的字符位置。。當exec第一次執行成功后,lastIndex為匹配項位置+1。正因為這樣,再次調用才會會獲得下一個匹配項。回到你這個例子,第一次循環后,re的lastIndex為40,而此時tpl變為了tpl='/cube_xinbao_dial_result/1/{{query}}'顯然你要匹配的query的位置是在40之前的,所以再次匹配時失敗,exec返回null,循環跳出。
回答4:var tpl = ’/cube_xinbao_dial_result/{{report_type}}/{{query}}’;var data = {report_type:1, query: ’223’}function render(tpl, data){ var re = /{{([^}]+)?}}/g; var tpl2=tpl; tpl.match(re).forEach(function (val) {tpl2= tpl2.replace(val,data[val.substring(2,val.length-2)]); }); return tpl2;}console.log(render(tpl,data));
輸出結果
/cube_xinbao_dial_result/1/223
相關文章:
1. angular.js - 輸入郵箱地址之后, 如何使其自動在末尾添加分號?2. javascript - 后臺管理系統左側折疊導航欄數據較多,怎么樣直接通過搜索去定位到具體某一個菜單項位置,并展開當前菜單3. 如何解決docker宿主機無法訪問容器中的服務?4. javascript - Web微信聊天輸入框解決方案5. javascript - 如何使用nodejs 將.html 文件轉化成canvas6. python - Scrapy存在內存泄漏的問題。7. 如何用筆記本上的apache做微信開發的服務器8. CSS3 畫如下圖形9. angular.js - $stateChangeSuccess事件在狀態跳轉的時候不執行?10. android - rxjava merge 返回Object對象數據如何緩存
