JavaScript 常見錯誤
本章將指出一些常見的 JavaScript 錯誤。
意外使用賦值運算子
如果程式設計師在 if 語句中意外地使用了賦值運算子（=），而不是比較運算子（==），JavaScript 程式可能會產生意想不到的結果。
此 if 語句返回 false（符合預期），因為 x 不等於 10
let x = 0;
if (x == 10)
自己動手試一試 »
此 if 語句返回 true（可能不是預期的），因為 10 為 true
let x = 0;
if (x = 10)
自己動手試一試 »
此 if 語句返回 false（可能不是預期的），因為 0 為 false
let x = 0;
if (x = 0)
自己動手試一試 »
賦值運算總是返回賦值的值。
期望鬆散比較
在常規比較中，資料型別無關緊要。此 if 語句返回 true
let x = 10;
let y = "10";
if (x == y)
自己動手試一試 »
在嚴格比較中，資料型別很重要。此 if 語句返回 false
let x = 10;
let y = "10";
if (x === y)
自己動手試一試 »
忘記 switch 語句使用嚴格比較是一個常見錯誤。
此 case switch 將顯示一個警報
let x = 10;
switch(x) {
case 10: alert("Hello");
}
自己動手試一試 »
此 case switch 將不會顯示警報
let x = 10;
switch(x) {
case "10": alert("Hello");
}
自己動手試一試 »
混淆加法與連線
加法是關於數字的相加。
連線是關於字串的相加。
在 JavaScript 中，這兩種操作都使用相同的 + 運算子。
因此，將數字作為數字相加與將數字作為字串相加會產生不同的結果。
let x = 10;
x = 10 + 5; // 現在 x 是 15
let y = 10;
y += "5"; // 現在 y 是 "105"
自己動手試一試 »
當相加兩個變數時，很難預測結果。
let x = 10;
let y = 5;
let z = x + y; // 現在 z 是 15
let x = 10;
let y = "5";
let z = x + y; // 現在 z 是 "105"
自己動手試一試 »
誤解浮點數
JavaScript 中的所有數字都儲存為 64 位浮點數（Floats）。
所有程式語言，包括 JavaScript，在處理精確的浮點值時都有困難。
let x = 0.1;
let y = 0.2;
let z = x + y // z 中的結果不是 0.3
自己動手試一試 »
為了解決上述問題，乘除法會有幫助。
拆分 JavaScript 字串
JavaScript 允許您將語句拆分成兩行。
但是，在字串中間拆分語句將不起作用。
如果您必須在字串中拆分語句，則必須使用“反斜槓”。
錯放分號
由於錯放了分號，此程式碼塊將執行，無論 x 的值是什麼。
if (x == 19);
{
// 程式碼塊
}
自己動手試一試 »
拆分 return 語句
JavaScript 的預設行為是在行尾自動關閉語句。
因此，這兩個示例將返回相同的結果。
JavaScript 還允許您將語句拆分成兩行。
因此，示例 3 也將返回相同的結果。
但是，如果您像這樣將 return 語句拆分成兩行，會發生什麼？
函式將返回 undefined！
為什麼？因為 JavaScript 認為您的意思是
Explanation
如果一個語句不完整，就像
let
JavaScript 將嘗試透過讀取下一行來完成語句。
power = 10;
但是，由於這個語句是完整的，
return
JavaScript 將自動將其關閉，如下所示：
return;
這是因為在 JavaScript 中，使用分號結束（終止）語句是可選的。
JavaScript 將在行尾關閉 return 語句，因為它是一個完整的語句。
切勿拆分 return 語句。
使用命名索引訪問陣列
許多程式語言支援帶命名索引的陣列。
帶命名索引的陣列稱為關聯陣列（或雜湊）。
JavaScript不支援帶命名索引的陣列。
在 JavaScript 中，陣列使用數字索引：
示例
const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length; // person.length 將返回 3
person[0]; // person[0] 將返回 "John"
自己動手試一試 »
在 JavaScript 中，物件使用命名索引。
如果您在訪問陣列時使用命名索引，JavaScript 會將陣列重新定義為標準物件。
自動重新定義後，陣列方法和屬性將產生未定義或不正確的結果。
示例
const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length; // person.length 將返回 0
person[0]; // person[0] 將返回 undefined
自己動手試一試 »
在定義末尾新增逗號
在 ECMAScript 5 中，物件和陣列定義中的尾隨逗號是合法的。
物件示例
person = {firstName:"John", lastName:"Doe", age:46,}
陣列示例
points = [40, 100, 1, 5, 25, 10,];
警告！！
Internet Explorer 8 將崩潰。
JSON 不允許尾隨逗號。
JSON
person = {"firstName":"John", "lastName":"Doe", "age":46}
JSON
points = [40, 100, 1, 5, 25, 10];
Undefined 不等於 Null
JavaScript 物件、變數、屬性和方法可以是 undefined。
此外，空的 JavaScript 物件可能具有 null 值。
這使得測試物件是否為空有點困難。
您可以透過測試其型別是否為 undefined 來測試物件是否存在。
但是您不能測試物件是否為 null，因為如果物件是 undefined，這將引發錯誤。
不正確
if (myObj === null)
要解決此問題，您必須測試物件是否不為 null 且不為 undefined。
但這仍然可能引發錯誤。
不正確
if (myObj !== null && typeof myObj !== "undefined")
因此，您必須先測試 undefined，然後才能測試 null。
