...（spread / rest）
[...arr]
問題點：完全看不出在幹嘛
正解：展開 / 複製 / 轉陣列
建議（你這種場景）
Array.from(arrLike)
✔ 比較好懂
✔ 好搜尋
??（nullish coalescing）
const name = input ?? "預設";
只在 null / undefined 才用預設
很多人以為等於 ||
0 || 100 // → 100 ❌
0 ?? 100 // → 0 ✅
坑點：0 / "" / false 不會觸發
|| 當預設值（舊寫法雷區）
const val = input || 100;
問題：
-
0 -
"" -
false
全部會被吃掉
現代建議：
const val = input ?? 100;
&& 偷偷執行（超陰）
isReady && doSomething();
意思是：
- 如果 isReady = true → 執行
問題：可讀性很差（新手完全看不懂）
建議
if (isReady) doSomething();
== vs ===（經典炸彈）
0 == false // true 😱
"" == 0 // true 😱
永遠用：
===
除非你非常確定在幹嘛（通常不是）
[] == false（地獄級）
[] == false // true 🤯
原因：JS 會偷偷轉型
解法：
不要用 ==
parseInt 沒給 radix
parseInt("08")
某些舊環境會變 0（當八進位）
正確：
parseInt("08", 10)
map 沒 return（超常見 bug）
arr.map(x => {
x * 2;
});
結果：
[undefined, undefined, undefined]
要嘛：
arr.map(x => x * 2);
或
arr.map(x => {
return x * 2;
});
forEach 不能 break（很多人中招）
arr.forEach(x => {
if (x === 3) break; // ❌ 直接爆
});
用：
for (const x of arr) {
if (x === 3) break;
}
this（最大魔王）
const obj = {
name: "A",
fn: function () {
console.log(this.name);
}
};
還算正常
但：
const fn = obj.fn;
fn(); // undefined 😱
this 會變
建議（簡化人生）
少用 this，多用：
const name = "A";
function fn() {
console.log(name);
}
或 arrow function（但也有坑）
setTimeout + loop
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100);
}
輸出：
3 3 3 😱
用 let
for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100);
}
空陣列判斷
if (arr) // ❌
永遠 true
正確：
if (arr.length > 0)
核心原則
如果你是走你這條路（高效 + 原生）：
優先選：
- 可讀性高
- 好搜尋
- 行為明確
