JavaScript 教程
JavaScript 使用誤區(qū)
本章節(jié)我們將討論 JavaScript 的使用誤區(qū)。
賦值運算符應(yīng)用錯誤
在 JavaScript 程序中如果你在 if 條件語句中使用賦值運算符的等號 (=) 將會產(chǎn)生一個錯誤結(jié)果, 正確的方法是使用比較運算符的兩個等號 (==)。
if 條件語句返回 false (是我們預(yù)期的)因為 x 不等于 10:
if 條件語句返回 true (不是我們預(yù)期的)因為條件語句執(zhí)行為 x 賦值 10，10 為 true:
if 條件語句返回 false (不是我們預(yù)期的)因為條件語句執(zhí)行為 x 賦值 0，0 為 false:
 |
賦值語句返回變量的值。 |
|---|
比較運算符常見錯誤
在常規(guī)的比較中，數(shù)據(jù)類型是被忽略的，以下 if 條件語句返回 true：
在嚴格的比較運算中，=== 為恒等計算符，同時檢查表達式的值與類型，以下 if 條件語句返回 false：
這種錯誤經(jīng)常會在 switch 語句中出現(xiàn)，switch 語句會使用恒等計算符(===)進行比較:
以下實例會執(zhí)行 alert 彈窗：
以下實例由于類型不一致不會執(zhí)行 alert 彈窗：
加法與連接注意事項
加法是兩個數(shù)字相加。
連接是兩個字符串連接。
JavaScript 的加法和連接都使用 + 運算符。
接下來我們可以通過實例查看兩個數(shù)字相加及數(shù)字與字符串連接的區(qū)別：
使用變量相加結(jié)果也不一致:
var y = 5;
var z = x + y;???????? ? // z 的結(jié)果為 15
var x = 10;
var y = "5";
var z = x + y;??? ?????? // z 的結(jié)果為 "105"
運行代碼 ?
浮點型數(shù)據(jù)使用注意事項
JavaScript 中的所有數(shù)據(jù)都是以 64 位浮點型數(shù)據(jù)(float) 來存儲。
所有的編程語言，包括 JavaScript，對浮點型數(shù)據(jù)的精確度都很難確定：
var y = 0.2;
var z = x + y??????????? // z 的結(jié)果為 0.30000000000000004
if (z == 0.3)??????????? // 返回 false
運行代碼 ?
為解決以上問題，可以用整數(shù)的乘除法來解決：
更多內(nèi)容可以參考：JavaScript 中精度問題以及解決方案
JavaScript 字符串分行
JavaScript 允許我們在字符串中使用斷行語句:
但是，在字符串中直接使用回車換行是會報錯的：
我們可以在選擇開發(fā)工具或按下 F12 來查看錯誤信息：
字符串?dāng)嘈行枰褂梅葱备?)，如下所示:
錯誤的使用分號
以下實例中，if 語句失去方法體，原 if 語句的方法體作為獨立的代碼塊被執(zhí)行，導(dǎo)致錯誤的輸出結(jié)果。
由于分號使用錯誤，if 語句中的代碼塊就一定會執(zhí)行：
return 語句使用注意事項
JavaScript 默認是在代碼的最后一行自動結(jié)束。
以下兩個實例返回結(jié)果是一樣的(一個有分號一個沒有):
JavaScript 也可以使用多行來結(jié)束一個語句。
以下實例返回相同的結(jié)果:
但是，以下實例結(jié)果會返回 undefined：
為什么會有這樣的結(jié)果呢？因為在 JavaScript 中，實例 4 的代碼與下面的代碼一致：
function myFunction(a) {
var
power = 10;
return; // 分號結(jié)束，返回 undefined
a * power;
}
解析
如果是一個不完整的語句，如下所示:
var
JavaScript 將嘗試讀取第二行的語句：
power = 10;
但是由于這樣的語句是完整的:
return
JavaScript 將自動關(guān)閉語句:
return;
在 JavaScript 中，分號是可選的 。
由于 return 是一個完整的語句，所以 JavaScript 將關(guān)閉 return 語句。
|
|
注意：不用對 return 語句進行斷行。 |
|---|
數(shù)組中使用名字來索引
許多程序語言都允許使用名字來作為數(shù)組的索引。
使用名字來作為索引的數(shù)組稱為關(guān)聯(lián)數(shù)組(或哈希)。
JavaScript 不支持使用名字來索引數(shù)組，只允許使用數(shù)字索引。
實例
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length;???????? // person.length 返回 3
var y = person[0];???????????? // person[0] 返回 "John"
運行代碼 ?
在 JavaScript 中, 對象 使用 名字作為索引。
如果你使用名字作為索引，當(dāng)訪問數(shù)組時，JavaScript 會把數(shù)組重新定義為標準對象。
執(zhí)行這樣操作后，數(shù)組的方法及屬性將不能再使用，否則會產(chǎn)生錯誤:
實例
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length;???????? // person.length 返回 0
var y = person[0];???????????? // person[0] 返回 undefined
運行代碼 ?
定義數(shù)組元素，最后不能添加逗號
數(shù)組最后一個值的后面添加逗號雖然語法沒有問題，但是在不同的瀏覽器可能得到不同的結(jié)果。
var colors = [5, 6, 7,]; //這樣數(shù)組的長度可能為3 也可能為4。
正確的定義方式：
points = [40, 100, 1, 5, 25, 10];
定義對象，最后不能添加逗號
錯誤的定義方式：
websites = {site:"小白教程", url:"", like:460,}
正確的定義方式：
websites = {site:"小白教程", url:"", like:460}
Undefined 不是 Null
在 JavaScript 中, null 用于對象, undefined 用于變量，屬性和方法。
對象只有被定義才有可能為 null，否則為 undefined。
如果我們想測試對象是否存在，在對象還沒定義時將會拋出一個錯誤。
錯誤的使用方式：
if (myObj !== null && typeof myObj !== "undefined")
正確的方式是我們需要先使用 typeof 來檢測對象是否已定義：
if (typeof myObj !== "undefined" && myObj !== null)
程序塊作用域
在每個代碼塊中 JavaScript 不會創(chuàng)建一個新的作用域，一般各個代碼塊的作用域都是全局的。
以下代碼的的變量 i 返回 10，而不是 undefined：