排坑·IPhone&IOS中不兼容正則中的斷言匹配

   排坑·IPhone&IOS中不兼容正則中的斷言匹配            

閱文時長	|  1.14分鐘	字數統計	|  1834.4字符
主要內容	|  一、問題切入 二、什麼是斷言匹配 三、斷言匹配的替換方案 四、聲明與參考資料
『排坑·IPhone&IOS中不兼容正則中的斷言匹配』
編寫人	| SCscHero	編寫時間	| 2020/12/7 AM12:14
文章類型	|  單篇	完成度	| 已完成
座右銘	每個偉大的事業，都有一個微不足道的開始。

1、問題切入   完成度：100%

a) 問題發現

PC端谷歌、QQ、Edge瀏覽器正常運行，移動端安卓設備能夠正常運行的正則。 Macbook沒有測試 （沒有Mac電腦）  。  在IPhone系設備，IOS系統中的Safari瀏覽器、QQ瀏覽器都出現報錯。報錯信息在JS中使用try..catch語句獲取到：SyntaxError:Invalid regular expression:invalid group specifier name。

b) 問題分析&排查方向

報錯分析：
報錯翻譯過來是"正則表達式無效:組說明符名稱無效。"，推測是正則中的分組問題，而後經查其餘使用正則的接口都是正常的，但出錯接口是由於含有斷言匹配。因而乎方向彷佛明確了，IPhone設備可能將斷言匹配當作了普通分組，因而爲了兼容IPhone設備，改用分組寫法匹配數據，詳見例子。

解決過程/排查方向/摸索過程（可跳過看下面解決方案）：
【錯誤方向1】首先，因爲在其餘設備、系統中均可以正常運行。因而覺得是CSS前綴問題，因而檢查了postcss-loader、autoprefixer插件。正常無問題。
【錯誤方向2】而後，檢查了下ES6語法是否轉換了ES5，檢查了babel配置，仍然沒問題。
【錯誤方向3】接着，想直接在IPhone機調試，發現沒法調試。因而尋找可調試方案。

• 須要使用Macbook電腦，因爲沒有硬件設備，因而尋找可替代方案。
• 使用windows系統模擬Safari網頁。此種方法須要安裝一大堆環境，因爲擔憂安裝過程當中又出現一大堆坑，因而繼續尋找可替代方案。
• 因而使用異常捕獲，在出錯接口中彈出。捕獲了異常。

c) 解決方案

改寫斷言匹配的正則表達式內容，以其餘正則表達式內容替代。詳見例子。

2、什麼是斷言匹配   完成度：100%

a) 我的理解

斷言匹配是什麼？斷言匹配是正則表達式中的一個概念。博主在Google了一下，沒有官方的定義，但在中文中基本叫斷言匹配。斷言匹配大體分爲四種。詳見下文。
斷言匹配做用/用途？是正則表達式的條件語句。斷言匹配的原子組，不會被正常的分組。因此在匹配的時候，能夠只匹配須要的部分。

b) 名詞普及

• (?!)零寬負向先行斷言
• (?=)零寬先行斷言
• (?<=)零寬後行斷言
• (?<!)零寬負向後行斷言。

c) 通俗解釋

• ?!後面不是什麼
• ?=後面是什麼
• ?<=前面是什麼。
• ?<!前面不是什麼

d) 詳細示例

下面本人使用JS的正則表達式的三個小例子來作示例。

---

  {
        //案例：替換除了pre標籤的其餘標籤爲p標籤。
        let str = `h1 label contentpre label contentspan label content`;
        let reg = /(?[\s\S]+?)/g;
        let repReg = str.replace(reg, "$");
        console.log(repReg);
    }

    {
        //案例:將全部元前面數字統一加上.00；
        let str = `
    500,1000.00,1500
    `;
        let reg = /(\d+)(.00)?/g;
        console.log(reg.exec(str));
        //v，匹配值。args，詳細數組。
        let res = str.replace(reg, (v, ...args) => {
            console.log(args);
            args[1] = args[1] || ".00";
            return args.splice(0, 2).join("");
        });
        console.log(res);
    }

    {
        //案例：匹配字母后面的數據
        let str = "SCscHero123";
        let reg = /(?<=SCscHero)\d+/i;
        console.log(str.match(reg));
    }

    {//案例:匹配字符串中不能出現SC字母
        let str = "SSSCscHero";
        //即起始的後面，不能出現SC
        console.log(str.match(/^(?!.*SC.*).*$/));
}

3、斷言匹配的替換方案   完成度：100%

斷言匹配的替換方案仍是挺多的，主要目的就是分析字符串，達到你的目的便可（基本是廢話，手動滑稽）。下面用本人的一個例子講一下怎麼處理。

---

【要求】從下面的字符串中提取須要的數字。

【分析】只須要提取數字，先後有固定的規律，所以符合使用斷言匹配的條件。一樣，也可使用分組匹配提取其中的內容。

    {//使用斷言匹配寫法
        let str = "SCscHero123SCscHero";
        let reg = /(?<=SCscHero)\d+(?=SCscHero)/g;
        console.log(str.match(reg)[0]);
    {//使用分組替換寫法
        let str = "SCscHero123SCscHero";
        let reg = /SCscHero(\d+)SCscHero/;
        console.log(str.match(reg)[1]);
    }

這只是個小例子哈，若是有其餘問題解決不了的，請留言博客。讓博主也想一想辦法，目前只能想到這個應用。