下面這些東西都不是我創造的,是我認為的一些書中的精華,關於Javascript的精華,通過學習,我覺得自己對Javascript的認識有了進一步的提升,弄清了一些或者稱之為技巧或竅門的東西。我會把這些知識運用到一個新的架構中去,新的架構的目標是用JS展示各種圖表,雖然已經有了很多該功能的架構,但是我覺得還是有必要建立一個自己的,因為我的終極目標是實現一個報表系統,中間需要這一塊。呵呵!!!,敬請關注。下面言歸正傳,開始我們的Javascript高手必須掌握的東西。這個東西會很長,可能會以連載的方式發布。
DOM與瀏覽器相關
分離關注點: WEB應用程式套件括3個部分,內容(HTML)、展示(CSS)、行為(Javascript)。開發應用時,使這3部分儘可能的分離。
DOM訪問
減少DOM訪問到最小:
1、避免在逐一查看DOM;
// 不好for(var i = 0; i < 100; i += 1){ document.getElementById('result').innerHTML += i + ', ';}// 好var i, content = '';for(i = 0; i < 100; i += 1){ content += i + ', ';}document.getElementById('result').innerHTML += content;
2、使用局部變數持有DOM引用;
// 不好var padding = document.getElementById(‘result’).style.padding, margin = document.getElementById("result").style.margin;// 好var style = document.getElementById(’result‘).style, padding = style.padding, margin = style.margin;
3、可以的話使用選取器API;
選取器只有比較流行的瀏覽器才有,也可以使用一些類庫,如JQuery
document.querySelector("ul .selected"); document.querySelectorAll("#widget .class");
4、遍曆HTML元素集時緩衝length;
DOM操作
如有可能使用document fragment輔助添加DOM節點;
事件
事件代理
長時間運行指令碼
Web Workers
遠程運行指令碼
語言:
常見轉換
x + "" => String(x)
+x => Number(x)
x-0 => Number(x)
!!x => Boolean(x)