聊一聊Vue和生物寝殴，有時候轉(zhuǎn)換一下思考模式动遭，會讓編程更開心^.
好記性不如爛筆頭，本來已經(jīng)整理好思路了捏肢，項目忙了大半個月奈籽，又得重新思考，于是我特意做了一張圖對比圖加深印象和理解

從最簡單的單細胞生物結(jié)構(gòu)鸵赫，再到復(fù)雜的人體衣屏，其實都可以看作一個正在運行的程序。微觀到整體辩棒，你會發(fā)現(xiàn)真的是驚人的一致狼忱。
DNA（源代碼）··>細胞（功能的js膨疏、結(jié)構(gòu)HTML、表現(xiàn)CSS）··>器官（組件）··>組織（功能模塊）··>人體（完整的項目）

復(fù)雜钻弄，高效佃却，完美，這就是生物給我們展現(xiàn)出的魅力窘俺。

DNA

DNA在生物學(xué)上是一切的根源饲帅，通過解旋和拷貝后形成一小段攜帶有特定信息的RNA，RNA可以看作是一個對象瘤泪，這個對象中的信息中有灶泵，它將要去做什么，以及它的下游將要做什么对途，最終成為什么赦邻，可能只是頭發(fā)的一小段，也可能是眼睛的某一個細小的部分掀宋。這個段RNA的信息是什么就已經(jīng)確定它將要做得接下來的事深纲。

DNA&RNA.jpeg

Vue

Vue全稱vue.js是用于web開發(fā)中的MVVM雙向綁定框架，通過盡可能簡單的 API 實現(xiàn)響應(yīng)的數(shù)據(jù)綁定和組合的視圖組件劲妙。
vue 在對模板進行解析通過渲染函數(shù)產(chǎn)生一個虛擬DOM湃鹊，這個虛擬dom中包含有該節(jié)點的名稱，屬性镣奋，將要完成的功能币呵，以及它子節(jié)點的相關(guān)信息。

DOM&RNA.jpg

細胞——最小的組件

含有完整的功能侨颈，可以與父組件通過細胞表面的糖蛋白（props）進行交互余赢，有一部分細胞它的功能以及體態(tài)無法進行很大的變化，主要功能是傳遞信息哈垢，比如腦細胞-神經(jīng)元妻柒，vue中可以通過new Vue創(chuàng)建一個eventBus,他沒有復(fù)雜的ui甚至連函數(shù)都沒有，作用就是進行信息傳遞耘分，就像神經(jīng)元通過神經(jīng)遞質(zhì)傳遞信息举塔，神經(jīng)元并不關(guān)心自己所傳信息是什么，它只是機械的傳到下一個神經(jīng)元求泰。也有需要高度形變央渣，適應(yīng)各種布局的白細胞，就如同項目中需要自適應(yīng)的控件渴频，放到哪個位置都能夠產(chǎn)生合理的“形變”芽丹，

組件，可以跟外界（父組件）進行交互卜朗，數(shù)據(jù)交互或者其他交互拔第，但它并不能直接去影響父組件咕村。而根據(jù)不同功能位置劃分，組件會分為很多不同的種類楼肪。

cell.jpg

器官--完整功能的組件

網(wǎng)頁嵌套不同功能的組件培廓，于是就形成了如同器官一樣，具有細化功能春叫。多個不同功能的細胞群聚合在一起，于是形成了器官泣港。

系統(tǒng)--多個不同器官協(xié)調(diào)完成某一項功能(模塊)

具有不同功能暂殖，進行功能上的耦合，完成一項功能当纱，呼吸系統(tǒng)組成：鼻呛每、口腔、喉坡氯、肺等晨横，完成人體整個呼吸過程。

呼吸系統(tǒng).jpg

就像樂高積木一樣箫柳，我們將"方塊"拼合在一起手形，并賦予功能，就成了手中的玩具悯恍。我們也可以把若干組件聚合起來库糠，實現(xiàn)某個目的，這就構(gòu)成了應(yīng)用（application）或者子系統(tǒng)（sub-system）涮毫。應(yīng)用的表現(xiàn)形式是一個由若干目錄組成的項目瞬欧。它的邊界由它的名字，應(yīng)用的入口（比如 main 函數(shù)）組成罢防。應(yīng)用類似于生物體中的系統(tǒng)艘虎，再往上生物學(xué)上就是一個生命個體，而編程中若干應(yīng)用組成的則是適應(yīng)業(yè)務(wù)需求的解決方案咒吐。

細細碎碎

• 1野建、每個細胞中含有的細胞器算組件么？
  細胞中的細胞器渤滞，細胞核贬墩，更像是一個單文件中的scripts、template妄呕、style陶舞。每一個帶有.vue后綴的文件是為一個組件細胞，組件細胞中的細胞器按照功能有明顯的劃分绪励，但細胞器（scripts肿孵、template唠粥、style）又可以互相影響，彼此耦合在一起組成一個組件停做。
• 2晤愧、vuex用于組件間信息傳遞，那么生物呢蛉腌？
  我們先看看vuex中有哪些東西官份，儲存信息的state,而state只能通過mutation修改。人體則是擁有遍布各大大小小細胞組件烙丛，器官組件的循環(huán)系統(tǒng)舅巷，通過激素調(diào)節(jié)細胞中酶的產(chǎn)量來調(diào)節(jié)生物行為和傳遞信息。激素作為傳遞中的信息河咽，游走在循環(huán)系統(tǒng)中钠右，它可以跟所有的組件接觸，但只要組件上有對應(yīng)的錨點（vuex的getter）忘蟹，細胞組件才能獲取激素所要傳遞信息飒房。舉個栗子：大腦：噢，我的天啊媚值，這個人還在單身狠毯，快讓他反思下吧。于是杂腰，下垂體分泌激素垃你，人體獲得指令，人體本身是無法去修改這個信息的喂很，只要在信息驅(qū)動下完成一定的操作（action）惜颇，走到超市里買到娃娃，獲得愉悅少辣，反饋回信息處理的總部凌摄，攜帶信息的激素才會修改。^.
  當(dāng)然以上只是個玩笑漓帅，生物學(xué)上的信息傳遞更為復(fù)雜锨亏，理念上卻很相似，通過人體循環(huán)系統(tǒng)游走在各細胞間忙干，特定組件接收對應(yīng)信息器予，但不能直接修改這些信息，只能通過(action)來操作捐迫，專門管理信息激素的(mutation)它對信息的操作是同步的乾翔，但是細胞組件則需要通過反饋操作(action)來改變mutation這個過程是異步的。

希望通過生物學(xué)知識，來給我們在編程過程中帶來好的啟發(fā)反浓。在我看來萌丈，生物和編程原理是一樣，只是所使用語言不一樣雷则。編程之美辆雾，生物之美。

神秘世界.jpg

彩虹狀斜紋藻.jpg

最小組件-細胞.jpg

細胞表面的getter.jpg

遍布各地的管道.jpg