從上次面試回來以后回懦，就打算自己做一個類似angular的前端框架气笙。一方面可以深刻理解一個前端框架的內(nèi)在，另一方面可以鍛煉自己的寫代碼能力怯晕。之所以模仿angular去寫潜圃，是因為自己對angular比較熟悉。
我給自己7個月的時間來完成這件事舟茶，希望可以在圣誕節(jié)的時候把這個框架當(dāng)作自己送給自己的禮物谭期。
我知道這個目標(biāo)很難，所以我認(rèn)為這是一次冒險吧凉，也許我花費寶貴的7個月時間一無所獲崇堵，也許我能有一個新的突破。我打算持續(xù)寫文章記錄我的所思所想所學(xué)客燕，這使得我的瘋狂舉動有了那么一些儀式感。
冒險之旅開始了狰贯。
假設(shè)有這么一個需求也搓，要實現(xiàn)下面原型圖里的功能：
- 可以展示一些學(xué)生信息。
- 點擊學(xué)生信息后面的叉叉涵紊，可以把這條信息刪除掉傍妒。
丑陋的原型圖
如果按照angular的思路，肯定是在scope上有一個數(shù)組摸柄，數(shù)組里面有兩個表示學(xué)生的對象颤练，就像這樣：
$scope.studentsList=[
{
name:'張三',
age:20,
hobbies:['打籃球','寫代碼']
},
{
name:'李四',
age:22,
hobbies:['泡妞','喝酒']
}
]
然后在html里面肯定是有一個地方寫一個循環(huán)，把這個數(shù)組循環(huán)顯示出來驱负，大概是這樣：
<div ng-repeat="item in studentsList">
{{item.name}}-{{item.age}}
<!--為了省事嗦玖，愛好部分就不寫了-->
</div>
顯然患雇，如果寫一個框架要實現(xiàn)這個功能，需要兩個基本部分：
- 大括號里面的表達式如何與相應(yīng)的$scope對象關(guān)聯(lián)起來宇挫。
- 需要一個函數(shù)來根據(jù)數(shù)據(jù)重新操作DOM苛吱。
我想先解決第一個問題，就是如何把表達式與相應(yīng)的scope對象關(guān)聯(lián)起來器瘪。我的思路是這樣：首先有一個parse函數(shù)翠储，這個函數(shù)接受一個表達式作為參數(shù)，返回另外一個函數(shù)A:
var fnA = parse('name');
這個函數(shù)A可以接收一個scope對象橡疼，然后將這個scope對象的name屬性解析出來：
var fnA = parse('name');//產(chǎn)生一個專門解析name屬性的函數(shù)
scope.name='林志玲';
fnA(scope)=='林志玲';
那么很顯然援所，我下一步要做的就是實現(xiàn)這個parse函數(shù)了。
