一、前言: 有時候,我們需要對一些字元串中的字元進行位置變化處理。如 “2016-11-16” 需要調整為 “16/11/2016”。我們知道有很多方法可以使用,比如split()拆分成數組後在進行拼接,也可以使用正則表達式的分組機制來進行處理。下麵我們就將這種方法進行實例對比: 二、split() ...
一、前言:
有時候,我們需要對一些字元串中的字元進行位置變化處理。如 “2016-11-16” 需要調整為 “16/11/2016”。我們知道有很多方法可以使用,比如split()拆分成數組後在進行拼接,也可以使用正則表達式的分組機制來進行處理。下麵我們就將這種方法進行實例對比:
二、split()方法:
split()方法主要是用於把一個字元串分割成字元串數組。
我們分析下字元串 “2016-11-16”,可以看出這個字元串是用比較規則的,數字之間是用 “-” 符號來分隔,所以我們可以使用 split('-') (意思是:hi,字元串 “2016-11-16”,你好!我現在要把你以 “-” 的方式拆分,在解析你的過程中,凡是碰到 “-”的時候,我就要從這裡切一刀,最後把切好的字元串片段都存放到一個字元串數組中去) 的方法拆分字元串。
$(function(){ var str = '2016-11-16', strArr = str.split('-'); //輸出: ["2016", "11", "16"] //進行字元串拼接處理 str = strArr[2]+'/'+strArr[1]+'/'+strArr[0]; console.log(str); //輸出:16/11/2016 });
現在,我們發現,用上面的split()方法很好用,尤其是拆分字元串的時候。那麼接下來,我們換個難一點的字元串,也就是稍微不那麼規則的字元串。看看我們的拆分過程是什麼樣的?
$(function(){ var str = 'abc2016-11.16', strArr = str.split('-'), //輸出: ["abc2016", "11.16"] strArr2 = strArr[0].split('abc'), //輸出: ["", "2016"] strArr3 = strArr[1].split('.'); //輸出: ["11", "16"] //進行字元串拼接處理 str = strArr3[1]+'/'+strArr3[0]+'/'+strArr2[1]; console.log(str); //輸出:16/11/2016 });
從上面的例子我們看出,不規則的字元串拆分,就是多次使用split()方法,只是拆分過程較為艱辛而已。但是,如果字元串 “abc2016-11.16” 中的 “abc” 不是固定的,那麼你就不太好用split('abc')方法來拆分字元串了。
三、正則表達式分組方式:
接上面的實例,我們對應的正則表達式代碼如下:
$(function(){ var str = '2016-11-16', reg = /(\d{4})-(\d{2})-(\d{2})/g; // 正則表達式中的分組: (\d{4}) 、(\d{2}) 、(\d{2})。 str = str.replace(reg, '$3/$2/$1'); //$1、$2、$3分別表示上面的三個分組匹配結果 console.log(str); //輸出:16/11/2016 });
是不是很容易?好吧,我們再看看上面提到的那個稍微複雜一點的實例,如果用正則表達式分組來處理,代碼應該是怎樣的?
$(function(){ var str = 'abc2016-11.16', reg = /[a-z]+(\d{4})-(\d{2}).(\d{2})/g; str = str.replace(reg, '$3/$2/$1'); console.log(str); //輸出:16/11/2016 });
你會發現用正則表達式分組匹配結果的形式,在處理一些字元串較為複雜但依然有規可循的情況下,是非常有效的。當然,你可以發揮更多的想象空間,創造更為複雜的字元串,使用正則表達式分組的方式試一下吧!