基礎數據結構與演算法 現在有兩個不同的JSON,比較複雜,可以參考這裡的DEMO中返回的JSON。要比較它們的差異,除了用現成的工具如beyond compare以外,如果我們的機器上沒有安裝這個工具,能如何較快解決?作為一個程式員,一個個對比是不可行的,對比完也不會有什麼收穫。我會把之放進Excel
基礎數據結構與演算法
現在有兩個不同的JSON,比較複雜,可以參考這裡的DEMO中返回的JSON。要比較它們的差異,除了用現成的工具如beyond compare
以外,如果我們的機器上沒有安裝這個工具,能如何較快解決?作為一個程式員,一個個對比是不可行的,對比完也不會有什麼收穫。我會把之放進Excel中(如果你機器連這個都沒有,那忽視我),先排序,再用二分法
去快速定位找到有差異的JSON屬性,即使是1024個欄位的大數據,也最多10次的定位即可找到。其實演算法這東西,並不是給你一道題目然後把死記下來的內容背出來,而是當你遇到相應的情景時,能想到用這個方法去解決。
HTML/CSS
DOCTYPE
曾經項目中遇到這樣一個問題,用其他瀏覽器打開頁面是好的,唯獨是IE8打開時出奇地慢。我註意到IE8打開時慢但CPU消耗並不高,只是網頁空白很久沒渲染出來,可以排除JS演算法上的問題。經過細心研讀代碼發現,有人把一部分script、 link等標簽放到了DOCTYPE
的前面。DOCTYPE
是用來告訴瀏覽器解釋整個文檔的一套法則的,一定要放在HTML部分的最前面,先有script標簽,那就意味著瀏覽器已經開始解釋了,後面再有DOCTYPE
也是沒有意義的了。把DOCTYPE
放到HTML部分的最前面,一開始提及的問題就解決了。
塊狀元素/內聯元素,盒子模型
HTML/CSS有一個特征,不會報錯,只會有瀏覽器渲染出來的結果不符合設計的邏輯這個問題,所以遇到問題時也很難拿到網上去搜索答案。所以要把HTML/CSS寫好,首先要自己理解當中的一些基礎原理,要說HTML佈局,塊狀元素/內聯元素
之間的關係我認為是最基礎的,延伸出去,就是CSS盒子模型
。另外,HTML中元素的嵌套組合關係也是十分重要的,CSS中很多屬性,如position,z-index,都是基於父對象而言的,撇開HTML去談CSS是無意義的。換而言之,要在結構(Structure)之下談論表現(Presentation)
。充分理解HTML/CSS中的這些基礎,然後制定出適用的一套規範方案,絕對讓團隊的工作效率提高,事半功倍。
HTML/CSS就能做到的事情,無必要把它交給javascript去做
HTML5中一個較大的改進是表單項、多了很多實用屬性如required,date控制項等,但是表單的一些很基礎的用法,還是不能忘記的。曾經遇到過有人想要實現點擊radio旁邊的文字時也要選中radio,於是就用jQuery去選擇,寫事件。其實,這個功能,只需要用一個label標簽把input包含在裡面就可以實現了(參考)。還有一些例子,如IE的條件註釋,CSS hack,這些功能我也見過去用javascript去實現
if(isIE() && IE.Verson == 7){//這些是人有封裝好的方法
$(".something").css({width:"700px"})
}
這樣的代碼只會白白耗費瀏覽器的性能。HTML/CSS就能做到的事情,無必要把它交給javascript去做
。
HTTP協議
現在很多項目中都是用ajax去提交JSON到後臺了,原始的那種HTTP提交已經比較少見(至少在我的項目中是這樣),但是我們也不能忘記設置form的method、action的原始提交方式,因為這個才是表單提交的原型,有助於我們理解HTTP協議,例如POST和GET的區別,理解數據是怎麼樣從前端到達後端的,又是怎麼樣從後端返回到前端。當你理解了這個,就可以更好地跟後端進行溝通,遇到數據上的問題也能較快地定位解決。
javascript
作用域
學過好幾種的編程語言,作用域問題都是老生常談了。在javascript中更是有函數的作用域這一基礎知識。關於這個,推薦《javascript權威指南》。當時我是把中文的讀去再去讀英文,把英文的讀完去找圖解,才感覺到把這一點理解清楚的。
JQuery
選擇器
在一個HTML DOM 樹中,我要進行一個比較複雜的元素選擇,不包含某些文字的帶有某某類名的元素的鄰居的父元素的……然後怎麼做?寫一個很複雜的jQuery
選擇器?打住。jquery選擇器原理是用正則表達式去分解你的選擇器字元串(這一部分叫做Sizzle
),然後再用內置的一些遍歷函數如prev,next等(其實這些函數也是基於DOM提供的方法),去找到你想要的元素。我會不去盲目地進行Sizzle的語義歧義測試,而是自己根據自己的邏輯去用prev,next等去找到自己的元素;而且退一萬步來說,我也會儘量避免使用複雜的選擇器(之前的方案也有提及),單位個元素用ID,多個元素用類,絕對高效準確。
以上是本人在實際項目中小結的部分容易忽視的基礎,還有更多的,還要在以後一步步積累,歸納基礎知識,避免這些問題。希望能幫助到大家,也能拋磚引玉。