Visual Studio - 超強的程式碼分析功能Code Map

02 December 2012 — Written by Sky Chang
#Visual Studio

老實說,這次Visual Studio 2012 Update 1 更新,最吸引到我的東西就是Code Map ( 好吧,其他功能小弟我也還沒好好的使用過XDD ),但不管怎樣,Code Map真的值得特別拿一篇出來講一下,雖然可能沒辦法把全部功能講完,但至少透過下面這個例子,就可以感受到Code Map的強大;而且Visual Studio 2012 Update 1的更新,也是中文版的,我想,大家亂用亂用XDD,應該也可以實驗出不錯的心得,所以這篇只是簡單的介紹入門,詳細的分析和應用,就交給各位前輩補齊了 ( 逃~ )。喔,對了,這個Code Map不是2012擴充套件的Code Map喔…是微軟Visual Studio 2012 Update 1提供的新功能。

首先,甚麼是Code Map?,如果懶得看這篇文章的人,也可以直接看官方的影片;簡單的說,這個工具類似反向工具一樣,可以幫我們把想要看的Class關係、Function關係,用圖表關聯起起來,甚至還可以點兩下後,快速的尋覽;用了此功能後,會更加地想要使用雙螢幕的衝動!?

廢話不多說,我們就稍微看一下Code Map的功能吧,例如下圖,我們可以看到,一個HomeController 繼承了 Controller ( 這裡是MVC專案,但小弟我這篇不會講到甚麼MVC的東西,只是簡單的使用MVC的檔案來介紹Code Map,所以大家不用擔心。 )

image

這時,如果我們在HomeController上面點滑鼠左鍵,就可以看到如下圖,在Code Map上顯示。

image

接下來,就會在旁邊的視窗,看到HomeController的圖案出現了,就如同神奇寶貝一樣,出現了!!

image

這時候,我們就可以叫這個神奇寶貝用技能,喔,不是,是在HomeController上按下滑鼠左鍵,我們就可以看到很多的選項,我們先選簡單的顯示基底類別。

image

這時候,我們的Code Map就會出現HomeController的基底型別"Controller",如下圖,就可以看到,真的和程式碼一模一樣!!( 好,我知道大家看到這邊,會想罵人XDD,因為這個連小弟我用程式碼都可以看的出來,HomeController是繼承於Controller,這有甚麼好畫出圖的… )

image

但實際上,就算是在HomeController裡面的ActionResult類別,也可以直接叫出選單,來產生Map喔!!( 但要注意,如果沒有加入MVC的Source Code,也會無法顯示出MAP,簡單的說,他是利用Source Code來產生,如果那個Class是已經被包在dll裡面,則會無法產生出來。 )

好吧,我承認,用尋覽的方式,還是可以跳到ActionResult的程式碼裡面( 如果有MVC Source Code的話 ),感覺上也還好,不夠炫。

image

我們這次回到HomeController的圖上,這次我們使用顯示這一項參考的型別。

image

這時候就比較有感覺了吧,我們可以從下圖看到,HomeController參考了那些Class,這時候,如果這個Class比較多東西,那我們就可以從此圖表一目了然!!,而如果選擇了"顯示參考這一項的型別",就會列出有使用到HomeController的Class喔!!

image

到這邊,有沒有覺得很方便!?,如果是以前,我們可能並須用Search的方式,然後整個一片大混亂,而現在,有圖表來幫我們顯示,而且點兩下圖表,就會自動跳到對應的程式碼喔!!

那這樣就結束了嗎??錯,連Function也可以;使用的方式一樣,我們也可以從Index()來產生出圖表。

image

甚至產生出這種圖表,都是自動產生的喔!!

image

那只能到Function嗎??錯,他的層級甚至到屬性喔!!連屬性的關係都可以搞出來,這真的是太強了!!

image

最後,完成的圖,當然可以寫註解;如果圖太亂,也可以利用Layout來調整;甚至可以直接利用電子郵件寄出,也支援存檔。

image

基本上就這樣嚕,基本上,用了之後,就會想使用雙螢幕,或是30吋的螢幕了…Orz…

後記

這個功能真的是太強大了,光是這個功能,就100%值得升級到Update 1,升級完的那天,小弟我用這個功能去debug,原本複雜的關係,一下子就釐清,一下子就把bug給修好,也就有更多的時間可以聊天,喔,不是,有更多的時間可以處理更多的bug了!!那麼好的東西,還不趕快去升級!!( 參考網址有Visual Studio 2012 Update 1的位置 )

參考網址

Sky & Study4.TW