跳到主要內容

文章

目前顯示的是 十二月, 2011的文章

[分享] javascript RegExp.$1 正規表示法理論與範例

javascript 裡面正規表示法其實蠻多元的,參考ECMAScript 15.5.2 當中提到,

""When String is called as part of a new expression, it is a constructor: it initialises the newly created object.
原文網址

意謂著當String 出現的時候,同時也會產生RegExp 這個物件,表示String 也同時帶有RegExp 屬性。因此可以瞭解為何javascript String 可以match, exec, replace 等function 當中使用正規表示法。

RegExp 如同前面提到是一個javascript object.該如何建構?

var reg = new RegExp(/text/, "gims"); var reg = /text/gims;
兩者的宣告方式是相同的,如此就宣告一個完整的正規表示法物件。實際應用幾乎使用第二種宣告方式,今天要討論的就是RegExp.$ 這個變數到底是怎麼產生。

在這邊就不討論深入正規表示法內部使用規則及原理,回到本文重點,實際上看一下在javascript 正規表示法的另外一種用法RegExp.$1.....$xx

當我們使用正規表示法時,使用分群就會可以將不同分群,視為不同的變數,就可以直接使用RexExp.$1,RexExp.$2...以此類推。

一個很爛的舉例來說,

var str = "abcdefghij"; var reg = new RegExp(/(\w)(\w)(\w)(\w)(\w)(\w)(\w)(\w)/); for (var i=1; i< 99; i++) { console.log(RegExp["$" + i]); }
會看到結果為,


live demo
實例上活用起來也蠻有趣的,例如

var str = "tel:(02)2888-8888"; var reg = new RegExp(/^tel:[(](\d\d)[)]+(\d+)-(\d+)/); str.match(reg); console.log("tel number is …

[閒談] 產品開發對於瀏覽器支援度之取捨

最近以前的學弟有提到關於Html5支援的問題,總覺得對於某些技術在某些瀏覽器之下無法運作,就放棄實做的可行性,個人真的覺得十分可惜,因此以下是我回覆的內容,當然也是在實務開發流程所會遇到的狀況,分享給大家。
---------------------------------------------------------------------
對於html5 的整體規格來說,目前已經是趨向於瀏覽器先行,目前的狀況幾乎是先實做,後規範,W3CWhatWG所有相關單位的規格書幾乎趨向於邊看邊修的地步,因此如果要實做這些新規範(新標準)自然會有所取捨,在前期也需要花費一番功夫。
文中提到的東西是實際存在的問題,在我們實際產品開發上幾乎會碰到html5 支援度問題,而我們的規劃會是:
1. 瀏覽器支援的底限為何 2. 其他瀏覽器支援度 3. 其他瀏覽器可替代方案
首先,查詢需要的規格有哪些,接著訂定出瀏覽器支援度的底限,例如本產品只能支援到IE8 ,IE6.7 完全無法支援(但是用IE6.7 會跳出警告視窗)
接著,當然以瀏覽器基本支援為最佳,再者於瀏覽器上開始尋找替代方案,例如安裝外掛程式、安裝Flash等方式進行調整。
通常會先建議使用的瀏覽器,以及其他支援的瀏覽器,當然會附註哪些瀏覽器效能會比較差,請升級或安裝他牌瀏覽器。(畢竟使用者希望用美工刀切西瓜,我們還是要讓他這麼做。)
例如像網站的圓角,在Chrome, firefox, Opera, Safari 都可以使用CSS語法自然呈現,不過對於IE 7.8.9 就會使用SVG圖形描繪的方式(目前是使用CSS-PIE3)達到相同的目的,當然不可否認,IE 7.8.9 自然呈現的效率就是慢,而另外一種選擇方式就採用,IE 7.8.9不會有圓角效果,只會出現正正方方的邊角。
當然這只是其中一個例子,在跨瀏覽器的實做上還有許多解決方式和許多有趣的套件庫可以參考。
這當中有一種例外,就是對於新技術的展現,就像目前只有Chrome,Opera支援Device這種tag,而你當中就是希望使用原生Tag 支援多媒體裝置的展現,當然就不需要考慮到瀏覽器支援度的問題,這個時候是屬於呈現新技術,展現新方向,跟一般產品開發上是截然不同。