DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> JavaScript編程實踐中容易出錯的地方
JavaScript編程實踐中容易出錯的地方
編輯:關於JavaScript     

這本來是翻譯Estelle Weyl的《15 JavaScript Gotchas》,裡面介紹的都是在JavaScript編程實踐中平時容易出錯或需要注意的地方,並提供避開這些陷阱的方法,總體上講,就是在認清事物本質的基礎樣要堅持好的編程習慣,其實這就是Douglas Crockford很久以前提出的JavaScript風格要素問題了,有些內容直接是相同的。在翻譯的過程中,我又看到了賢安去年翻譯的《JavaScript的9個陷阱及評點》,其內容又有些交叉在一起,所以我就在現有翻譯的基礎上做了一個簡單的拼合,並依據自己的理解增加了一些注釋和解釋。

  1. 區分大小寫:變量名、屬性和方法全部都區分大小寫
  2. 不匹配的引號、圓括號或花括號將拋出錯誤
  3. 條件語句:3個常見陷阱
  4. 換行:一直用分號結束語句來避免常見的換行問題
  5. 標點法:在對象聲明的尾部逗號將導致出錯
  6. HTML id 沖突
  7. 變量作用域:全局變量對局部變量
  8. 函數重載:當重載不存在時,覆蓋函數
  9. 區分string.replace()函數不是全局的
  10. parseInt應該包含兩個參數
  11. “this”和綁定問題
  12. 為參數設置默認值,以免你遺漏它們
  13. for each循環是用於對象而不是數組
  14. switch語句需要點技巧
  15. 總是在檢查undefined前檢查null
  16. 時間處理陷阱

區分大小寫

變量名和函數名都是區分大小寫的。就像配錯的引號一樣,這些大家都知道。但是,由於錯誤是不作聲的,所以這是一個提醒。為自己選擇一個命名規則,並堅持它。而且,記住JavaScript中的原生函數和CSS屬性都是 駱駝拼寫法(camelCase)。

getElementById(’myId’) != getElementByID(’myId’); //它應該是“Id”而不是“ID”
getElementById(’myId‘) != getElementById(’myID‘); // “Id”也不等於“ID”
document.getElementById('myId').style.Color; //返回 "undefined"

不匹配的引號、圓括號或花括號

避免陷入不匹配的引號、圓括號或花括號陷阱的最好方式是編碼時一直同時寫出打開和關閉這兩個元素符號,然後在其中間加入代碼。開始:

var myString = ""; //在輸入字符串值之前寫入這對引號
function myFunction(){
 if(){//關閉每個打開的括弧
 }
}
//統計所有的左括號和右括號數量,並且確保它們相等
alert(parseInt(var1)*(parseInt(var2)+parseInt(var3))); //關閉每個打開的圓括號

每當你打開一個元素,請關閉它。當你添加了關閉圓括號後,你再把函數的參數放進圓括號中。如果有一串圓括號,統計所有打開的圓括號和所有關閉的圓括號,並且確保這兩個數字相等。

條件語句(3個陷阱)

  1. 所有的條件語句都必須位於圓括號中。
     if(var1 == var2){}
  2. 不要犯無意地使用賦值運算符的錯誤:把第二個參數的值賦給第一個參數。因為它是一個邏輯問題,它將一直返回true且不會報錯。
    if(var1 = var2){} // 返回true。把var2賦值給var1
  3. JavaScript是弱類型,除了在 switch語句 中。當JavaScript在case比較時,它是非弱類型。
    var myVar = 5;
    if(myVar == '5'){ //返回true,因為JavaScript是弱類型
     alert("hi");  //這個alert將執行,因為JavaScript通常不在意數據類型
    }
    switch(myVar){
     case '5':
     alert("hi"); //這個alert將不會執行,因為數據類型不匹配
    }

換行

當心JavaScript中的硬換行。換行被解釋為表示行結束的分號。即使在字符串中,如果在引號中包括了一個硬換行,那麼你會得到一個解析錯誤(未結束的字符串)。

var bad  = '<ul id="myId">
  <li>some text</li>
  <li>more text</li>
  </ul>'; // 未結束的字符串錯誤
var good = '<ul id="myId">' +
 ‘<li>some text</li>‘ +
 ‘<li>more text</li>‘ +
 ‘</ul>’; // 正確

前面討論過的換行被解釋為分號的規則並不適用於控制結構這種情況:條件語句關閉圓括號後的換行並不是給其一個分號。

一直使用分號和圓括號,那麼你不會因換行而出錯,你的代碼易於閱讀,且除了那些不使用分號的怪異源碼外你會少一些顧慮:所以當

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved