霍春陽（Hcy），Vue.js 官方團(tuán)隊(duì)成員。專注于 Web 研發(fā)領(lǐng)域，是 Vue.js 3 的核心貢獻(xiàn)者之一，Vue.js 文檔生成工具 Vuese 的作者，技術(shù)社區(qū)活躍者，曾撰寫大量頗受好評(píng)的技術(shù)博客。

經(jīng)過一年的準(zhǔn)備，霍春陽的新書《Vue.js設(shè)計(jì)與實(shí)現(xiàn)》正式出版了！預(yù)售一周就已重印，刷新了近兩年的圖書重印記錄。?

坊間流傳著很多有關(guān)他的傳奇經(jīng)歷，很多人對(duì)他的經(jīng)歷都非常好奇。今天這篇文章讓大家走近霍春陽，了解一個(gè)真實(shí)的他，一個(gè)喜歡把事情做到極致的人，一個(gè)喜歡“留下點(diǎn)什么”的開發(fā)者。

---

大家好，我是霍春陽（Hcy）。

很開心的和大家分享一個(gè)消息：我的新書《Vue.js 設(shè)計(jì)與實(shí)現(xiàn)》出版了。

從 2021 年初開始準(zhǔn)備這本書，到今天正式出版，很開心一切都能夠按部就班的進(jìn)行，雖然中間因疫情原因耽擱了一些，但整體上是在軌的。這里必須要感謝出版社里各位盡職盡責(zé)的工作人員，尤其是王軍花老師。

借著這個(gè)機(jī)會(huì)我想和讀者分享一些關(guān)于本書和我，以及 Vue.js 的一些事情。就從為什么要寫這本書開始吧。

為何要寫這本書？

這確實(shí)也是值得我本人深思的一件事兒。我想從兩個(gè)方面來闡述我寫這本書的原因：

• “干一行，愛一行”

• “留下點(diǎn)什么”

知乎上有一個(gè)問題：“你做程序員真的是因?yàn)闊釔蹎?#xff1f;”。我回答了這個(gè)問題，感興趣的朋友可以在這里了閱讀完整的回答：你做程序員真的是因?yàn)闊釔蹎?#xff1f;

大意是，恰好寫代碼這事兒能賺錢。而我是屬于那種“干一行，愛一行”的人，它講的是一種職業(yè)精神，即無所謂做哪個(gè)行業(yè)，但只要確定了一個(gè)行業(yè)，那么就能全身心的投入，并能夠因?yàn)檫@種投入和達(dá)到的成就讓你真正的愛上這個(gè)行業(yè)，即所謂的“干一行，愛一行”。

從小我就有一個(gè)特殊的習(xí)慣（也許是怪癖），我也不知道是從什么時(shí)候、什么原因讓我產(chǎn)生并保持這種習(xí)慣。這個(gè)習(xí)慣是：“留下點(diǎn)什么”。

小時(shí)候家里有一臺(tái)黑白電視機(jī)，每天播放的內(nèi)容大概會(huì)在電視劇、廣告、動(dòng)畫片之間反復(fù)。然后突然有一天我就想，如何能證明我看過電視的內(nèi)容呢？

為了能夠證明這一點(diǎn)，我就會(huì)根據(jù)電視劇、廣告、動(dòng)畫片這幾個(gè)欄目對(duì)電視的內(nèi)容進(jìn)行分類并寫在紙上，一旦電視切換了播放內(nèi)容，我就會(huì)在紙上對(duì)應(yīng)的分類后面畫一道豎線。

這樣一來，紙上的豎線就能夠證明我看過電視了，而這些豎線就是我看電視這件事情“留下來”的東西。這會(huì)給我一種莫名的“充實(shí)”感。

類似的事情還有很多。例如，每年秋收的時(shí)候家里用水稻脫粒機(jī)對(duì)水稻進(jìn)行脫粒處理，脫粒后的水稻會(huì)被灌進(jìn)編織袋中，由于脫粒的計(jì)費(fèi)方式是按照最終水稻的袋數(shù)來算錢的，因此每灌滿一個(gè)編織袋都會(huì)記一次數(shù)量。

計(jì)數(shù)方式也很有意思，由于“正”字的筆畫數(shù)量正好是 5，兩個(gè)“正”字就代表 10 袋。當(dāng)時(shí)，我最喜歡的事情就是拿著粉筆在黑色木板上幫大人們記數(shù)。因?yàn)檫@種行為很符合“留下點(diǎn)什么”的審美。

再如，小時(shí)候玩游戲機(jī)（插游戲卡的那種），無論什么游戲，我都喜歡在游戲結(jié)束之后拿筆和紙記錄下局次，輸贏結(jié)果等，以便代表我確實(shí)玩過這些游戲，而記錄下來的這些內(nèi)容，就是我玩游戲這個(gè)行為“留下來”的東西。

回到這個(gè)問題本身，我為什么要寫這本書？

很簡單，我想“留下點(diǎn)什么”，以證明我確實(shí)為 Vue.js 做過貢獻(xiàn)。我很享受寫這本書的過程，它讓我感到很“充實(shí)”，留下了一些東西的那種充實(shí)。

以寫代碼為職業(yè)，“干一行，愛一行”的性格讓我更加敬業(yè)，并成為 Vue.js 的團(tuán)隊(duì)成員。如果還能“留下點(diǎn)什么”，那這種“誘惑”對(duì)我來說簡直無法抗拒。若是“留下的這些東西”還能夠?yàn)樽x者、為 Vue.js 社區(qū)帶來一些幫助的話，那真的是完美了。

而更加慶幸的一點(diǎn)是，真的有很多讀者私信我并表達(dá)了對(duì)這本書的期待。在一定程度上，我個(gè)人覺得我也非常適合編寫這么本書，其中一個(gè)最大的原因是：我認(rèn)為我能與絕大部分讀者產(chǎn)生共鳴。

通常來說，學(xué)習(xí)一項(xiàng)技術(shù)只需要掌握其核心思想即可，而無需事無巨細(xì)地深入細(xì)節(jié)。這樣的學(xué)習(xí)方式有一定好處，但同時(shí)會(huì)給人一種“虛”的感覺。

就像上學(xué)時(shí)學(xué)習(xí)操作系統(tǒng)課程一樣，如果你不跟著課程完成對(duì)應(yīng)的實(shí)驗(yàn)，實(shí)際修改一下操作系統(tǒng)的代碼，而只是學(xué)習(xí)一些進(jìn)程、線程、文件系統(tǒng)、虛擬內(nèi)存的抽象概念，雖然能夠在一定程度上理解，但始終覺得不踏實(shí)。

同樣的，學(xué)習(xí)前端框架也是一樣的道理。基于這個(gè)原因，這本書則照顧到了兩個(gè)方面。

一方面，它從全局視角介紹了框架設(shè)計(jì)及其各個(gè)方面的權(quán)衡；另一方面，也從具體的代碼出發(fā)，真正地將功能實(shí)現(xiàn)，并在此過程中讓讀者能夠切身感受并學(xué)習(xí)其中的難點(diǎn)和解決方案。

我的確花費(fèi)了很大精力編寫本書，共 500 頁，希望它的內(nèi)容不會(huì)讓你們失望。同時(shí)由于我的水平有限，有任何疏漏望不吝指出。

Vue.js 3 仍然在更新，

這本書會(huì)過時(shí)嗎？

這其實(shí)是一個(gè)好問題，也是我愿意強(qiáng)調(diào)的一個(gè)問題。簡單來說，答案是：不會(huì)。

這本書并非一本“源碼解讀”書籍，而是建立在筆者對(duì) Vue.js 3 的理解之上，以由簡入繁的方式介紹 Vue.js 3 中各個(gè)功能模塊的設(shè)計(jì)與實(shí)現(xiàn)。同時(shí)輔以足夠的“細(xì)節(jié)”，旨在幫助讀者能夠更輕松、更自然地理解 Vue.js 3 的框架機(jī)理。

舉個(gè)例子，本書在介紹 Vue.js 3 中基于 Proxy 實(shí)現(xiàn)的響應(yīng)系統(tǒng)時(shí)，并沒有照貓畫虎地照搬 Vue.js 源碼中的實(shí)現(xiàn)，并基于此反推代碼的運(yùn)行機(jī)制。

而是會(huì)從 ECMAScript 的規(guī)范入手，詳細(xì)地闡述 JavaScript 對(duì)象的本質(zhì)，以及創(chuàng)建代理對(duì)象（Proxy）的內(nèi)在原理，并基于此從 0 開始，一點(diǎn)一點(diǎn)地構(gòu)建整個(gè)完善的響應(yīng)系統(tǒng)。

這樣做的好處在于，讀者能夠了解代碼的發(fā)展路徑，真正的做到知其然并知其所以然。

再如，在模板編譯的章節(jié)中。本書同樣帶領(lǐng)讀者從 WHATWG 的規(guī)范入手，詳細(xì)地介紹了文本模式的概念以及其對(duì)解析器的影響。

在編寫模板編譯器的過程中，還會(huì)涉及到字符引用的解碼，這些內(nèi)容都需要從規(guī)范入手才能真正地理解“為什么”。幸運(yùn)的是，本書會(huì)帶領(lǐng)讀者閱讀并理解相關(guān)的規(guī)范。

因此，我認(rèn)為這本書是不會(huì)過時(shí)的。尤其是書中介紹的方法論，任何代碼的背后都需要有一個(gè)“原因”來支撐。

這個(gè)“原因”是多樣性的，它可能是某一個(gè)規(guī)范（如 ECMAScript 規(guī)范或 WHATWG 中關(guān)于 HTML 的解析規(guī)范），也可能是某個(gè)瀏覽器的 Bug，更可能是工具或語言的 limitation。

如何為 Vue.js 社區(qū)做貢獻(xiàn)？

為 Vue.js 社區(qū)做貢獻(xiàn)的方式是多種多樣的，我們歡迎任何種類的貢獻(xiàn)，無論哪一種貢獻(xiàn)，都值得給予足夠的尊重。

對(duì)于這本書而言，我也將其定義成是為 Vue.js 社區(qū)做貢獻(xiàn)的一種方式，旨在幫助大家更好的學(xué)習(xí)并使用 Vue.js。

社區(qū)里存在著各種各樣的角色，并非一定要以提交代碼的方式才算貢獻(xiàn)。在一定程度上來說，深度使用 Vue.js 并提供有意義的反饋信息甚至要比提交代碼的貢獻(xiàn)還大。而社區(qū)內(nèi)也的的確確存在這樣的角色，并且 Vue.js 團(tuán)隊(duì)也非常歡迎并尊重他們。

社區(qū)的強(qiáng)大與否，很大一部分由生態(tài)決定。曾有一段時(shí)間我專注為 Vue.js 3 的核心做貢獻(xiàn)，這也是我有信心完成這本書的最重要原因之一。

Vue.js 的核心將仍然由尤大領(lǐng)導(dǎo)，我本人未來會(huì)在 Vue.js 的社區(qū)項(xiàng)目建設(shè)和探索方向做更多的嘗試。正如我給自己立的 2022 年的 flag：

基于這個(gè)目標(biāo)，現(xiàn)在已經(jīng)有了一些小的成果。為了解析 Vue SFC 中的<style>塊，我開發(fā)了?Telecss

再來一張圖書的照片：

最后，感謝為這本書寫推薦序/語的各位大佬，以及所有支持這本書的讀者，非常感謝，感恩~

希望我像按約定完成這本書一樣，也能在 2022 年底按約定完成這個(gè) flag。同時(shí)我也有一些新的想法，希望能夠順帶著完成。為 Vue.js 的社區(qū)多樣性添磚加瓦，大家一起加油！！！

文末福利

小伙伴們，可以在本文留言區(qū)留言任意內(nèi)容參與抽獎(jiǎng)~

抽獎(jiǎng)規(guī)則：在我的公眾號(hào)留言超過3次的小伙伴中隨機(jī)抽1位。

其余留言再隨機(jī)抽1位。

另外源碼共讀提交5次及以上筆記的小伙伴群里（僅30多人）抽1位。

截止時(shí)間：3月7日晚8點(diǎn)

獲得新書《Vue.js設(shè)計(jì)與實(shí)現(xiàn)》包郵送。

中獎(jiǎng)小伙伴，我會(huì)聯(lián)系兌獎(jiǎng)。也可以提前掃碼加我微信 ruochuan12 以防失聯(lián)。或者發(fā)送源碼兩字參與源碼共讀。

總結(jié)

以上是生活随笔為你收集整理的Vue.js 官方团队成员霍春阳新作，深入解析 Vue.js 设计细节【文末送书】的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。