相距 FCC 西安第一次線下編程活動，從 2016 年 09 月 16 日到 2017 年 03 月 12 日，半年的時間，在這個社區，發生了很多很多難忘的故事。身為小小組織者的我，也將很多成長中的“第一次”揮灑到了這里。FCC 西安，伴隨每一位開發者茁壯成長。
不是我們跟奇數過不去，反而恰巧，在第一、三、五次，活動辦得最有意思也最具干貨。就不細細講來其中的緣由。
這次，FCC 西安進高校，西安郵電大學一個新開的，很棒的大學生創業咖啡館里，分享編程人♀生。
1
Icebreaker Games。次次活動都輪流介紹一下自己是不是不清真？能創新，就有不一樣的體驗。這次分為三個小組，每個人代表自己小組來說出自己的三個愛好或特長，其中一個是假的，其余小組搶答說愛好的人的哪個愛好是假的，答對加一分，答錯扣一分。分數最低的小組呢，再來介紹一下自己的家鄉和美食饞饞大家。命運，掌握在自己的手上。
每個人的愛好都各有所長，假的那個愛好反而更有趣和調皮。就說說我說的三個真假愛好吧，看看你能猜出來嗎？
- 喜歡讀書、編程、游戲和寫作。
- 苦瓜真好吃。
- 熟悉前端和后臺。
答案，最后揭曉。
2
不知道各位 FCC 學員曾經、現在所在的大學與開源社區的合作活躍度怎么樣。只要有一雙善于發現的眼睛，我相信在工科學校內，都會找到一倆個和開源社區有合作的大學生團體吧？
我們的西郵(選址原因罷，這次參加活動的大部分是西郵學生)，就與下圖的開源社區有過長期合作，其中，FCC 中文社區，便是我帶進來的。祈愿長傳。
3
FCC 的介紹每一位 FCC 學員在自己的城市線下活動中相信聽過很多次了。這次，切入一個主題，淺談 FCC 的 MEAN 架構。自己學歷尚淺，參考資料外加個人感悟而訴。
MEAN = MongoDB + Express + Angular + Node.js
從上述單詞縮寫的示意可以看到， MEAN 架構作為全 Javascript 的 Web 開發架構，能夠端到端地開發現代的、全堆棧的二十一世紀 Web 項目，有如下特點：
- (M)ongoDB——采用 NoSQL 的文檔數據庫，使用 JSON 風格來存儲數據，甚至也是使用 JS 來進行 sql 查詢；
- (E)xpress——基于Node的Web開發框架，提供對服務端路由的訪問；
- (A)agular——JS的前端開發框架，提供了聲明式的雙向數據綁定；
- (N)ode——基于V8的運行時環境（JS語言開發），可以構建快速響應、可擴展的網絡應用。
再對比 LAMP 技術堆棧，詳細內容可以獨立成章，這里便不細細而談。
4
干貨，絕對的干貨。JavaScript 之正則表達式入門。以下內容參考自慕課網的 JS 正則表達式。
^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$
以前，總覺得正則表達式太高端，像匯編語言一樣羞澀難懂。看到上面的這串正則，我知道肯定有規則可尋，但只能看懂個 a-z 什么的。好了，不雞湯了，上更多的干貨。
身為開發者，我們一直在默默使用著正則。git add .這種最讓我們偷懶的 git 命令一直在使用著。如果你還沒用過，FCC 可以帶給你這些知識點。
JavaScript 中通過內置對象 RegExg 支持正則表達式。字符串對象 String 也有相應的正則方法。
先用常見的 string.split(',') 為例，在 FCC 上做過題的學員肯定十分熟悉這條語句，其實，string.split(',') 中的 , 會被轉做正則，效果等價于 string.split(/,/g); ，意為在全局尋找 , 并將逗號前后的字符串分別順序放入數組中。
回到 RegExg 對象中，有兩種方法實例化 RegExp 對象：字面量和構造函數。
在下圖示例中，第二條語句 var reg = /\bis\b/g 用字面量的方式聲明了一條正則表達式規則，該規則將在全局(g, global)中匹配所有單獨存在的 is 單詞。第三條語句進行匹配。看看第四條語句，var reg = new RegExp('\bb\is\\b', 'g') ，實例化一個 RegExp 對象并傳入相關參數觸發構造函數，第一個參數便是正則表達式，第二個代表該規則將在全局(g, global)中匹配。
可以看到，字面量中，用 // 包裹正則表達式語句，RegExp 對象里，由于是 JS 語句，反斜線 ```本身并不代表反斜線而是轉義的意思，應該將反斜線用自身轉義，\才代表一個反斜線，\t``` 代表一個制表符，俗稱縮進。如下轉義常見的字符不止能在 JavaScript 中見到。
| 轉義字符 | 含義 |
|---|---|
| \t | 水平制表符 |
| \v | 垂直制表符 |
| \n | 換行符 |
| \r | 回車符 |
| \0 | 空字符 |
| \f | 換頁符 |
| \cX | 與 X 對應的控制字符(Ctrl + X) |
元字符
正則表達式由兩種基本字符類型組成：原意文本字符和元字符。原意文本字符很好理解，在正則表達式中，a 就是要找到 a 字母，但若是看到 [a-z] 那肯定不是匹配 [a-z] 這五個連續的字符了，意思是把 a 字母到 z 字母中所有字母組成一類，只要能匹配到這一類的任意一個就滿足匹配規則。[、] 便是元字符。
在正則表達式中有特殊含義的非字母字符有，+、?、$、^、.、|、\、(、)、{、}、[、]。如果就想用這些元字符本身的意思，$ 就是代表美元符，轉義即可：\$
字符類
剛剛提到，“在正則表達式中出現的 [a-z] 是把 a 字母到 z 字母中所有字母組成一類，只要能匹配到這一類的任意一個就滿足匹配規則。”，就用到了字符類。一般情況下，正則表達式的一個字符對應字符串的一個字符，而用 [] 來構建一個簡單的類。^ 來創建一個反向類。
怎么理解呢？以下兩行代碼中，第一行將字符串中所有 a、b、c 的字符替換成 X 字符。而第二行則代表將字符串中所有不是 a、b、c 的字符替換成 X，后者便是反向類。
'a1b2c3d4'.replace(/[abc]/g, 'X');
'a1b2c3d4'.replace(/[^abc]/g, 'X');
預定義類
到了這里，[0-9] 便能輕松看懂了。但想要寫一個匹配 11 位電話號碼的規則，難道連寫十一次嗎？當然不是，\d 便等價于 [0123456789]，d 即代表著 digit。
\d\d\d\d\d\d\d\d\d\d\d總比[0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]要好。
常見的其他預定義類還有很多： \D 等價于 [^0-9] ，剛才提到，這是反向類，用來匹配所有非數字字符。\s等價于 [\t\n\x0B\f\r]匹配空白符，\S 匹配非空白符\w 等價于 [a-zA-Z_0-9] 匹配單詞字符，包括下劃線、橫線和數字。\W匹配非單詞字符。
\d\d\d\d\d\w，匹配的是什么呢？
量詞
當 \d 出現多次時，完全可以用代表數量的量詞來替換，十一個\d不如一個\d{11}簡單明了。
| 量詞 | 含義 |
|---|---|
| ? | 出現零次或一次(至多一次) |
| + | 出現一次或多次(最少一次) |
| * | 出現零次或多次(任意次) |
| {n} | 出現 n 次 |
| {n,m} | 出現 n 到 m 次 |
| {n,} | 至少出現 n 次 |
| {0,n} | 出現最多 n 次 |
這時，\d{20}\w\d?\w\w+\d*\d{3}\w{3,5}\d{3,} 便可以達到大道至簡的地步，用可視化工具 Regexper 來直觀表示如下。
修飾符
之前一直提到 //g 是字面量正則表達式加上 g, global 全局模式查找符合規則的文本，而全局模式是默認關閉的。g 在這里存在，便稱作正則表達式修飾符。它可不是元字符。
其它修飾符有：i，ignore case，代表忽略大小寫，默認是不忽略的；m，multiple lines，跳過回車符等字符，在多行文本中進行匹配。
JavaScript 中的 RegExp() 方法
test()、exec() 以及 compile()。
- test() 方法檢索字符串中的指定值。返回值是 true 或 false。
- exec() 方法檢索字符串中的指定值。返回值是被找到的值。如果沒有發現匹配，則返回 null。您可以向 RegExp 對象添加第二個參數，以設定檢索。例如，如果需要找到所有某個字符的所有存在，則可以使用
g參數。 - compile() 方法用于改變 RegExp。compile() 既可以改變檢索模式，也可以添加或刪除第二個參數。
下例代碼可以實踐這一概念。
分組
經過正則表達式匹配到的文本不一定非得替換，有時我們還需要利用。例如用正則表達式將日期 2017-03-12 變成 03/12/2017 的格式，就需要在找出年月日的同時重新排序，這時便用的到“分組”的概念。
^(\d{4})[/-](\d{2})[/-](\d{2})$
可視化結果如下，看到了group關鍵字。
上例正則表達式匹配時，用()包住符合匹配規則的對象，這時，第一個被包住的(\d{4})是一個group，會把“年”賦值給$1，月、日便更好理解，分別為$2、$3。如何實踐？
var reg = /^(\d{4})[/-](\d{2})[/-](\d{2})$/;
var string = "2017-03-12";
string.replace(reg, '替換前：$1-$2-$3, 替換后：$2/$3/$1');
以及更多
到了這里，也僅僅是開始，正則表達式是最需要自己動手去練習的知識點。還有更多的概念如正則表達式的零寬斷言、負向零寬斷言、注釋、貪婪與懶惰等就不細細說來。
5
正則官網實戰。FCC 西安社區的主頁，第一次公開到大家面前，是這個樣子，切合這次分享的內容。并新增環節，在官網上利用 Chrome 開發者工具直接實戰，兩道題目任你挑戰。答案呢，直接就貼在下方了。看與不看，“借鑒”與否，是自己的選擇，學到內容就好。
6
FCC 線下編程社區不可或缺的環節，編程實戰！雖然線上我們可以做，但線下一起在線上做題的體驗，你有沒有體驗過呢？有問題，及時的互幫互助了。
End
我可能有個“假特長”，在上面的破冰活動中，“熟悉前端和后臺”當然是還不可能是我的真特長了。一個直奔全棧目標、只有一年半學習時間的 Web 學徒，在“熟悉”面前，更應謙虛為妙。也只是，略懂皮毛罷了。
FCC 西安第五次的活動就到了這里，相比較成都社區舉辦過的 10+ 次活動和主頁開發，相比最早成立的北京社區的整體技術更強性，FCC 西安，還有很多路要走。
在 FCC 這個新興無校園大學中，怎么畢業，就要看每個學員自己的選擇。
- Hello，我是韓亦樂，現任本科軟工男一枚。軟件工程專業的一路學習中，我有很多感悟，也享受持續分享的過程。如果想了解更多或能及時收到我的最新文章，歡迎訂閱我的個人微信號：韓亦樂。我的簡書個人主頁中，有我的微信個人訂閱號二維碼和 Github 主頁地址；我的知乎主頁 中也會堅持產出，歡迎關注。
- 本文內部編號經由我的 Github 相關倉庫統一管理；本文可能發布在多個平臺但僅在上述倉庫中長期維護；本文同時采用【知識共享署名-非商業性使用-禁止演繹 4.0 國際許可協議】進行許可。
