1.避免隐式的全局變量
function foo() {
var a = b = 0; //=> var a = (b = 0)
}
上面的例子中a為foo内的局部變量,b因為未在foo内聲明,成為隐式的全局變量。
使用var建立的全局變量可以删除,隐式的全局變量不可以删除。
var a = 1;
b = 2;//隐式
function foo() {
c = 3;//隐式
}
delete a;
delete b;
delete c;
typeof a;//"number"
typeof b;//"undefined"
typeof c;//"undefined"
2. 單一var模式
隻使用一個var在函數頂部聲明所需變量
3. for循環
先計算出數組(或容器)長度緩存起來,避免每次循環都計算一次長度
4. for-in循環
推薦使用正常的for循環來周遊數組,使用for-in循環處理對象。
例:過濾對象中Clone的方法
for(var i in obj){
if(Object.prototype.hasOmnProperty.call(obj,i){//練習一下call
console.log(i,":",man[i]);
}
}
5. 不要增加内置的原型
原因:影響可維護性(添加屬性與原生屬性沖突),給原型添加的屬性在沒有使用
hasOwnProperty()
時可能在循環中出現。
例外情況:
if(typeof Object.prototype.myMethod !== "function") {//自定義的屬性或方法并未存在
Object.prototype.myMethod = function() {
}
}
6. 避免使用隐式類型轉化
即在資料比較時使用
===
取代
==
fault == 0;//true
== 0; //true
7. 避免使用 eval()
eval()
eval()
存在安全隐患,可能執行一些惡意代碼
8. 使用 parseInt()
的數值約定
parseInt()
如果不進行數值約定,當字元串(year)的第一個值為0時,字元串會被當做一個八進制數來處理,等同于
year = parseInt(year, 8);
9. 大括号和return
//警告:未預期的傳回值
function foo() {
return
{
name: 'xiaowang"
};
}
等價于
function foo() {
return undefined;//隐式添加了一個分号,未通路到下面的代碼
// {
// name: 'xiaowang"
// };
}
10. 命名模式
構造函數使用大駝峰,函數和方法名使用小駝峰。使用下劃線結尾表明私有變量,使用一個下劃線字首辨別受保護屬性。
11. 編寫API文檔
YUIDoc
12. 初始化時分支
var utils = {
addListener: function (el, type, fn) {
if (typeof window.addEventListener === 'function'){
el.addEventListener(type, fn, false);
}else if(typeof document.attachEvent === 'function') { //IE浏覽器
el.attachEvent('on' + type, fn);
}else { //更早版本的浏覽器
el['on' + type] = fn;
}
}
removeListener: function (el, type, fn) {
//.......
}
}
此段代碼效率低下,每次調用
utils.addListener()
或
removeListener()
時都要進行重複的條件判斷,優化方法如下:
var utils = {
addListener: null,
removeListener: null
}
if (typeof window.addEventListener === 'function'){
utils.addListener = function (el, type, fn) {
el.addEventListener(type, fn, false);
}
utils.removeListener = function (el, type, fn) {
el.removeEventListener(type, fn, false);
}
}else if(typeof document.attachEvent === 'function') { //IE浏覽器
utils.addListener = function (el, type, fn) {
el.attachEvent('on' + type, fn);
}
utils.removeListener = function (el, type, fn) {
el.detachEvent(type, fn);
}
}else { //更早版本的浏覽器
utils.addListener = function (el, type, fn) {
el['on' + type] = fn;
}
utils.removeListener = function (el, type, fn) {
el['on' + type] = null;
}
}