不管對(duì)于哪個(gè)段位的程序員來(lái)說(shuō)，讀源碼都是一件好處頗多的事情聪轿，特別于初學(xué)者而言爷肝，這能迅速的吸納優(yōu)秀框架精華代碼營(yíng)養(yǎng)，迅速成長(zhǎng)陆错。不巧的是灯抛，晦澀難懂的源碼，很容易讓人心生怯意音瓷。今天分享一下讀源碼的方法对嚼。
一、了解框架解決了什么問(wèn)題
這不光對(duì)讀源碼有幫助绳慎，對(duì)整個(gè)學(xué)習(xí)都很有幫助纵竖。思考一個(gè)問(wèn)題：你學(xué)習(xí) Vue\React 的原因，除了它們?nèi)缛罩刑煨臃撸俨粚W(xué)習(xí)都不好意思找工作了靡砌，還摻雜了一些它們的某些優(yōu)秀特性能給我?guī)?lái)某些好處的思考么？
新潮的框架珊楼，開發(fā)者需要而且也應(yīng)該去了解通殃，相比之前的技術(shù)體系，這個(gè)框架到底解決了什么問(wèn)題厕宗，優(yōu)勢(shì)在哪画舌，懷著目的去學(xué)習(xí)才不至于迷茫堕担。例如 Vue\React 最大的優(yōu)點(diǎn)是什么呢？組件化吧骗炉，帶著框架是如何解決這個(gè)問(wèn)題的疑問(wèn)去學(xué)習(xí)照宝，定能事半功倍。
二句葵、了解框架的設(shè)計(jì)思想
我們看不懂源碼（或者看起來(lái)舉步維艱）厕鹃，并不是因?yàn)椴欢骋痪湔Z(yǔ)法，而是不明白作者的思路乍丈。舉一個(gè)簡(jiǎn)單的例子：
?//這個(gè)方法可以獲得point2頂角的弧度值
? ? functiongetAngle(point1,?point2,?point3){
? ? ? ?var?bb?=?(point2.y?-?point1.y)*(point2.y?-?point1.y)?+?(point2.x?-?point1.x)*(point2.x?-?point1.x);
? ? ? ? var?aa?=?(point3.y?-?point1.y)*(point3.y?-?point1.y)?+?(point3.x?-?point1.x)*(point3.x?-?point1.x);
? ? ? ?var?cc?=?(point3.y?-?point2.y)*(point3.y?-?point2.y)?+?(point3.x?-?point2.x)*(point3.x?-?point2.x);
? ? ? ? var?cosa?=?(bb?+?cc?-?aa)/(2*Math.sqrt(bb)*Math.sqrt(cc));
? ? ? ?return?Math.acos(cosa);
? ? }
getAngle方法接收三個(gè)坐標(biāo)參數(shù)剂碴，可以計(jì)算出 point2 頂角的弧度值，如果不告訴你這使用了運(yùn)用三角形的余弦定理轻专，恐怕你看半天也看不出來(lái)這是怎么算出來(lái)的忆矛。
了解框架的設(shè)計(jì)思想的方法：
? 1.到框架的官網(wǎng)看文檔。開源的框架请垛，甭管詳不詳細(xì)催训，這肯定是第一手權(quán)威資料
? 2.到網(wǎng)上搜別人的分析總結(jié)(源碼分析也不會(huì)少)，大多數(shù)情況下宗收，都會(huì)有大神已經(jīng)研究過(guò)了漫拭，站在巨人的肩膀上，能省不少事
另外混稽，設(shè)計(jì)思想是整個(gè)框架層面的采驻，對(duì)于每一個(gè)實(shí)現(xiàn)細(xì)節(jié)，又會(huì)使用不少設(shè)計(jì)模式匈勋，例如函數(shù)式編程（Js 中最為常用）礼旅、單例模式、代理模式洽洁、工廠模式等等痘系，這就需要平時(shí)的積累了。有一定代碼量的積累之后饿自，建議閱讀一些設(shè)計(jì)模式類的書籍碎浇，對(duì)自己的代碼設(shè)計(jì)，以及閱讀別人的源碼璃俗，都很有益處。
三悉默、搭建調(diào)試環(huán)境城豁，摸清執(zhí)行主脈絡(luò)
細(xì)分到每個(gè)模塊，要對(duì)模塊功能有個(gè)整體的把握抄课，如何去做到這個(gè)“把握”唱星？除了官方文檔和網(wǎng)上查閱的資料雳旅，最好的辦法就是寫一個(gè)簡(jiǎn)單的 Demo，搭建好測(cè)試環(huán)境间聊，增加一些調(diào)試信息攒盈，自然能理清除框架的生命周期中，每一步需要調(diào)用那個(gè)模塊（對(duì)于目錄結(jié)構(gòu)很清晰的優(yōu)秀框架哎榴，有時(shí)候也可以憑直覺猜測(cè)型豁，打印日志確認(rèn)）
四、分清主次
框架源碼就是一顆枝繁葉茂的參天大樹尚蝌，而你要做的事情是從根部往上爬迎变。樹要這么多分支，時(shí)間又是這么昂貴飘言，閱讀的策略很重要衣形。我們的閱讀路徑，要以主要流程為主（也就是樹的主驅(qū)趕姿鸿，這樣才能盡可能快的到達(dá)頂點(diǎn)）谆吴，對(duì)于一些細(xì)枝末節(jié)，再這之后再來(lái)慢慢啃（或者有必要的時(shí)候）苛预。
例如句狼，要去閱讀 Vue 的源碼，有個(gè)目錄是解析模板碟渺，生成語(yǔ)法樹 AST 從而最終生成 Render Function 的, 其實(shí)這一步最關(guān)鍵的是這個(gè) Render Function 的生成結(jié)果鲜锚，對(duì)于如何去解析模板、生成語(yǔ)法樹苫拍，可以先放一放芜繁，回頭需要的時(shí)候再回頭看。否則你很容易卡死在某個(gè)點(diǎn)上出不來(lái)绒极，從而產(chǎn)生放棄的念頭
五骏令、堅(jiān)持不放棄
技術(shù)策略得當(dāng)，遇到棘手過(guò)不去的問(wèn)題也很正常垄提，這時(shí)考驗(yàn)的就是毅力了榔袋，繼續(xù)調(diào)試、搜索資料铡俐、或者找個(gè)大神來(lái)問(wèn)一問(wèn)都行凰兑，只要不放棄就好。
六审丘、學(xué)會(huì)向他人求助
無(wú)論你的自學(xué)能力有多強(qiáng)吏够，無(wú)論你是P4還是P7，總會(huì)有遇到困難的時(shí)候。普通人遇到瓶頸只能自己默默的去一次次沖擊锅知，如果沖擊成功還好播急，是另一片天地；倘若沖擊失敗售睹，輕則灰心喪氣迷失一陣子桩警，重則一蹶不振。
如果有人領(lǐng)路呢昌妹？看過(guò)小說(shuō)的都知道捶枢，沖關(guān)的時(shí)候如果有人指導(dǎo)，借鑒前人的經(jīng)驗(yàn)捺宗，可以少走很多彎路柱蟀。人生不過(guò)數(shù)十載，何不把時(shí)間節(jié)省出來(lái)去多學(xué)點(diǎn)東西蚜厉，多做點(diǎn)有意義的事情碍讯。
為了幫大家盡快的提升自己命斧，更有效率的進(jìn)階，我精心準(zhǔn)備了框架源碼系列資料，希望能幫你早日突破自己震捣！
點(diǎn)擊免費(fèi)領(lǐng)壬屑：【Java互聯(lián)網(wǎng)技術(shù)交流】備注：777?
