本文的目標(biāo)
以更加清晰的結(jié)構(gòu)和邏輯讓我們更好的理解Vue雙向綁定的原理實(shí)現(xiàn)：
1耳鸯、理解Vue的雙向綁定代碼實(shí)現(xiàn)邏輯；
2膀曾、理解data數(shù)據(jù)為何必須要以函數(shù)形式定義县爬；
3、理解為何可以直接以 this.xxx 訪問添谊，屬性财喳、方法、data斩狱、props;
4耳高、理解 vue.delete()實(shí)現(xiàn)原理；
5所踊、理解生命周期函數(shù)執(zhí)行的時(shí)機(jī)泌枪；
6、理解為何vue的監(jiān)聽會消耗大量的內(nèi)存秕岛；
7碌燕、以直觀 “樹” 的方式理解Vue雙向綁定源碼，或以樹的視角觀察領(lǐng)悟世間萬物继薛；
引言
茫茫宇宙修壕，浩瀚星辰，世間萬物大多我們都可以用一顆樹來表示他們之間的從屬關(guān)系遏考。
大到宇宙小到原子列舉身邊所見的一切事物慈鸠，都可以用一顆樹來與別人產(chǎn)生聯(lián)系，比如：
1诈皿、宇宙-河外星系-銀河系-太陽系等等林束，可以用一顆樹來表示；
2稽亏、我們學(xué)習(xí)的知識壶冒，數(shù)學(xué)，物理截歉，生物胖腾，語言等都會分門別類，用一顆樹來表示他們的關(guān)系瘪松；
3咸作、國家的權(quán)利機(jī)構(gòu)，公司的組織架構(gòu)宵睦，等等记罚，世界的一切似乎都可以用一顆樹來描述；
4壳嚎、計(jì)算機(jī)有一種特別的數(shù)據(jù)結(jié)構(gòu) “樹”桐智；
先來看看 一顆樹的樣子：
抽象下變成程序員熟悉的樣子：
樹結(jié)構(gòu)數(shù)據(jù)有2種遍歷方法：
深度優(yōu)先遍歷 (DFS)
DFS 會沿特定路徑遍歷到葉子結(jié)點(diǎn)再回溯 (backtracking) 進(jìn)入臨近路徑繼續(xù)遍歷末早。
最簡單，我們最常用的實(shí)現(xiàn)方式就是说庭，函數(shù)遞歸調(diào)用遍歷樹結(jié)構(gòu)數(shù)據(jù)然磷。
其實(shí)現(xiàn)的本質(zhì)原理是，棧結(jié)構(gòu)數(shù)據(jù)刊驴，后進(jìn)先出姿搜。
我們使用一個(gè)數(shù)組也很容易模擬一個(gè)棧。
廣度優(yōu)先搜索 (BFS)
BFS ：按照結(jié)點(diǎn)深度逐層遍歷樹結(jié)構(gòu)捆憎。
一層一層的遍歷樹的節(jié)點(diǎn)舅柜，其代碼實(shí)現(xiàn)攻礼，使用隊(duì)列數(shù)據(jù)結(jié)構(gòu)业踢，先進(jìn)先出礁扮。
1 -> 2、5 -> 3 太伊、4->6、7 用數(shù)組很容易實(shí)現(xiàn)隊(duì)列逛钻。
Vue雙向綁定的原理實(shí)現(xiàn)
經(jīng)過分析僚焦，我們發(fā)現(xiàn)，Vue程序的執(zhí)行曙痘，就像一顆樹一樣，于是边坤，我們可以把程序里面的一個(gè)函數(shù)看成一個(gè)節(jié)點(diǎn)，把他們構(gòu)建成一顆樹的結(jié)構(gòu)茧痒，讓我們能夠更加清晰的看到源碼的程序結(jié)構(gòu)肮韧，對代碼的結(jié)構(gòu)，邏輯理解更加清晰旺订。
先看看源碼目錄結(jié)構(gòu)：
下面是把Vue源碼的核心代碼和函數(shù)看成一個(gè)節(jié)點(diǎn)描述出來的大體雙向綁定結(jié)構(gòu)圖：
mindmaster地址： Vue雙向綁定核心代碼函數(shù)關(guān)系
我們發(fā)現(xiàn)弄企，JS代碼的執(zhí)行区拳，就像一顆樹的深度遍歷，那是因?yàn)橛５鳎瑔尉€程的JS函數(shù)執(zhí)行環(huán)境是一個(gè)棧環(huán)境結(jié)構(gòu)的洽瞬，后進(jìn)先出。
源碼的復(fù)雜度很高伙窃，細(xì)節(jié)很多，先看看這個(gè) 從零實(shí)現(xiàn)一個(gè)VUE为障，深入了解vue實(shí)現(xiàn)原理 有助于我們理解雙向綁定原理。
由于理解有限放祟，難免錯(cuò)誤，還請多多指教鞋喇。
