1、發現問題：

今天在讀require.js源代碼時，不經意讀到這么一段代碼：

1 //If no name, and callback is a function, then figure out if it a 2 //CommonJS thing with dependencies. 3 if (!deps && isFunction(callback)) { 4 deps = []; 5 //Remove comments from the callback string, 6 //look for require calls, and pull them into the dependencies, 7 //but only if there are function args. 8 if (callback.length) { 9 callback 10 .toString() 11 .replace(commentRegExp, '') 12 .replace(cjsRequireRegExp, function (match, dep) { 13 deps.push(dep); 14 }); 15 16 //May be a CommonJS thing even without require calls, but still 17 //could use exports, and module. Avoid doing exports and module 18 //work though if it just needs require. 19 //REQUIRES the function to expect the CommonJS variables in the 20 //order listed below. 21 deps = (callback.length === 1 ? ['require'] : ['require', 'exports', 'module']).concat(deps); 22 } 23 }

同樣，在sea.js，也讀到類似的代碼段：

1 function parseDependencies(code) { 2 var ret = [] 3 4 code.replace(SLASH_RE, "") 5 .replace(REQUIRE_RE, function(m, m1, m2) { 6 if (m2) { 7 ret.push(m2) 8 } 9 }) 10 11 return ret 12 }

或許你未曾讀過這兩個文件，但是這不是我提及問題的重點（如果讀者對此感興趣，可以自己到github上去找源碼研究），仔細看兩個代碼段中，都有使用到我們今天的主角——replace。

看replace傳入的第一個參數，恩，是我想象的東西——一個正則表達式，但是到我讀到第二個參數時，我凌亂了，盡然傳入的是一個函數！確實，雖然我以前知道第二個參數可以傳入函數，但是奇怪的是，它為什么沒有返還值呢？

2、關于replace：

在w3cschool中有這么一段定義：

語法

stringObject.replace(regexp/substr,replacement)

參數 描述

regexp/substr	必需。規定子字符串或要替換的模式的 RegExp 對象。 請注意，如果該值是一個字符串，則將它作為要檢索的直接量文本模式，而不是首先被轉換為 RegExp 對象。
replacement	必需。一個字符串值。規定了替換文本或生成替換文本的函數。

?

很多和我一樣的菜鳥大概會被這個描述所蒙蔽，其實當第二個參數傳入函數時，我們不僅可以通過函數來動態生成并返還成要替換的文本，此刻的函數中的arguments對象會保存一些很重要的數據，舉個小小的例子：

1 //定義一個檢測“=數字”正則表達式和一個測試字符串 2 var reg = /\=(\d)/g, 3 testStr = 'a=1,b=2,c=3,d=3'; 4 //調用testStr的replace函數 5 testStr.replace(reg, function () { 6 //打印arguments對象的詳細信息 7 console.log(arguments); 8 });

在谷歌控制臺下，可以看到如下的測試結果：

這個函數被執行了4次，每次執行都代表正則表達成功匹配到了字符子串，那么對應的每次執行的arguments對象里面又存的什么信息呢？

在這里，我們可以看到：

參數1——表示當前匹配到的結果；

參數2——表示匹配到的正則表達式的“組”（也就是當前正則表達式小括號里面內容——這里指“\d”）；

參數3——表示匹配到的字符串的索引位置；

參數4——不用多說，就是源字符串自己。

其實，通過網上的搜索，最終可以找到replace最官方、最標準的用法，當然，通過一些資料的查詢，這里傳入函數的arguments對象，是一個“動態可伸縮的”的，因為我們所使用的正則表達式里面含有多個組，而這里僅僅只有一個組，所以我們“當且僅當”可以看到第二個參數。

那么，我們把正則表達式換成這樣又如何呢？

1 //定義一個檢測“=數字”正則表達式和一個測試字符串 2 var reg = /\=\d/g, 3 testStr = 'a=1,b=2,c=3,d=3'; 4 //調用testStr的replace函數 5 testStr.replace(reg, function () { 6 //打印arguments對象的詳細信息 7 console.log(arguments); 8 });

顯然，如我們所愿了，我們并沒有捕獲到等號后面的數字：

3、運用場景：

利用正則表達式的組定義，可以方便地利用這個特性，快速地找到你想要的信息，這是解決js正則表達式不支持“零寬斷言”的一個巧妙的方法，正如我給大家舉的例子，我們大多時候在驗證的時候，想匹配到“=”后面的數字，而不是“=”+[數字]。

回歸我們文章開頭的代碼，了解過AMD編程的童鞋大概都知道CommonJs編程范式，require.js和sea.js在找尋一個模塊的工廠函數內的依賴模塊id時，將工廠函數轉換成了string，并且替換掉注釋之后，利用我們今天說所的這個特性，把工廠函數里面的類似require('xxx/xxx')的代碼偵測出來，提取出模塊id——‘xxx/xxx’，并且存到數組中，最終來形成這個模塊依賴其他模塊的id集合。（如果不知所云，請點擊這里吧https://github.com/amdjs/amdjs-api/wiki/AMD）

轉載于:https://www.cnblogs.com/wuchu/p/3405984.html

總結

以上是生活随笔為你收集整理的JavaScript中奇妙的replace的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。