Cộng số và chuỗi trong JavaScript: Cộng hay Nối?

Trong JS, toán tử + vừa dùng để cộng số, vừa dùng để nối chuỗi. Quy tắc: nếu bất kỳ toán hạng nào là chuỗi → nối chuỗi (concatenation).

Quy tắc ưu tiên

1. Cả hai là số → cộng toán học.
2. Ít nhất một là chuỗi → nối chuỗi (toán hạng kia được ép thành chuỗi).
3. Thực hiện từ trái sang phải (left-to-right associativity).

Ví dụ minh họa

<script>
  const a = 5 + 5;        // 10 (number + number)
  const b = "5" + 5;      // "55" (string + number → string)
  const c = 5 + 5 + "5";  // "105" (5+5=10 → "10" + "5" = "105")
  const d = "Hello" + 5;  // "Hello5"

  document.write(a + '<br>'); // 10
  document.write(b + '<br>'); // 55
  document.write(c + '<br>'); // 105
  document.write(d + '<br>'); // Hello5

  document.write(typeof a + '<br>'); // number
  document.write(typeof b + '<br>'); // string
  document.write(typeof c + '<br>'); // string
  document.write(typeof d + '<br>'); // string
</script>

Kết quả

10
55
105
Hello5
number
string
string
string

Bẫy thường gặp

// Mong muốn: 1 + 2 + 3 = 6
const result = 1 + 2 + "3"; // "33" — vì 1+2=3 → "3"+"3"="33"

// Fix: ép kiểu hoặc dùng ngoặc
const fixed1 = 1 + 2 + Number("3"); // 6
const fixed2 = (1 + 2) + Number("3"); // 6
const fixed3 = 1 + 2 + +"3"; // 6 (unary + ép kiểu)

Template Literal (ES6) — Cách tốt hơn để nối

const name = 'JS';
const version = 2024;
// Thay vì: "Language: " + name + " " + version
const msg = `Language: ${name} ${version}`; // Đọc dễ, ít lỗi hơn

Tóm tắt