前言

以往我們只是習(xí)慣于通過(guò)數(shù)組下標(biāo)來(lái)訪問(wèn)正則匹配到的分組，但分組達(dá)到4、5個(gè)時(shí)，標(biāo)識(shí)起來(lái)就會(huì)非常麻煩。V8早已實(shí)現(xiàn)了正則命名分組提案，只是我們很少使用，本文將介紹JS的正則命名分組。

以往的做法

假設(shè)要使用正則匹配一個(gè)日期的年月日，以往我們會(huì)這樣做：

const RE_DATE = /(/d{4})-(/d{2})-(/d{2})/;const matchObj = RE_DATE.exec('1999-12-31');const year = matchObj[1]; // 1999const month = matchObj[2]; // 12const day = matchObj[3]; // 31

這里有幾個(gè)缺點(diǎn)：

所有這些問(wèn)題，都可以通過(guò)正則命名分組來(lái)解決。

現(xiàn)在的玩法

現(xiàn)在你只需要給分組里面一個(gè)命名標(biāo)識(shí)即可：

(?<year>/d{4})

這里，我們用變量year標(biāo)記了上一個(gè)捕獲組＃1。 該名稱必須是合法的JavaScript標(biāo)識(shí)符。 匹配后，您可以通過(guò)matchObj.groups.year訪問(wèn)捕獲的字符串。

讓我們通過(guò)命名分組重寫(xiě)前面的代碼：

const RE_DATE = /(?<year>/d{4})-(?<month>/d{2})-(?<day>/d{2})/;const matchObj = RE_DATE.exec('1999-12-31');const year = matchObj.groups.year; // 1999const month = matchObj.groups.month; // 12const day = matchObj.groups.day; // 31

如果正則里面有了命名分組，那么匹配結(jié)果會(huì)多了一個(gè)groups 的屬性，這個(gè)屬性中包含了一切命名分組的捕獲結(jié)果。配合上解構(gòu)大法使用又是一股清流：

const {groups: {day, year}} = RE_DATE.exec('1999-12-31');console.log(year); // 1999console.log(day); // 31

當(dāng)然，即使你使用了命名分組，那么返回的結(jié)果還可以通過(guò)以往的數(shù)組下標(biāo)方式訪問(wèn)：

const year2 = matchObj[1]; // 1999const month2 = matchObj[2]; // 12const day2 = matchObj[3]; // 31

命名分組具有以下優(yōu)點(diǎn)：

反向引用

反向引用命名分組/k<name>

看下面這個(gè)匹配重復(fù)單詞的例子：

const RE_TWICE = /^(?<word>[a-z]+)!/k<word>$/;RE_TWICE.test('abc!abc'); // trueRE_TWICE.test('abc!ab'); // false