ทำไมควรหลีกเลี่ยง ++ และ -- ใน JavaScript?

ควรหลีกเลี่ยง increment (++) และ decrement (--) operators เพราะอาจนำไปสู่ผลลัพธ์ที่ไม่คาดคิด เงื่อนไขบางอย่าง:

ใน assignment statement อาจให้ผลลัพธ์ไม่พึงประสงค์:

ตัวอย่าง

<html> 
  <body> 
    <script> 
      var a = 5; 
      var b = ++a;  // pre-increment: a=6, b=6
      var c = a++;  // post-increment: c=6, a=7
      var d = ++c;  // pre-increment: c=7, d=7
      document.write(a);   // 7
      document.write("\r" + b); // 6
      document.write("\r" + c); // 7
      document.write("\r" + d); // 7
    </script> 
  </body> 
</html>

Output

Whitespace ระหว่าง operator และตัวแปรอาจให้ผลลัพธ์ไม่คาดคิด:

a = b = c = 1; 
++a;  // a = 2
b--;  // b = 0
c;    // c = 1

ปัญหาเพิ่มเติม

• Pre vs Post confusion: ++x vs x++ คืนค่าต่างกัน
• Whitespace sensitivity: a++ +b parse เป็น (a++) + b ไม่ใช่ a + (++b)
• Side effects ใน expression: arr[i++] = arr[i++] — undefined behavior
• Readability: โค้ดอ่านยาก Debug ยาก

แนวทางที่ดีกว่า

// แทน ++/--
a = a + 1;      // ชัดเจนกว่า a++
a += 1;         // สั้นและชัดเจน
a = a - 1;      // แทน a--
a -= 1;         // สั้นและชัดเจน

// สำหรับ loop
for (let i = 0; i < n; i++) { }  // OK - idiomatic
i += 1;  // ใน while loop

หลาย style guides (Airbnb, Google) แนะนำหลีกเลี่ยง ++/-- ยกเว้นใน for loop