Logical NOT Operator (!) กลับสถานะตรรกะของ operand: true→false, false→true และแปลงค่าให้เป็น Boolean
ตัวอย่างจากบทความ
<html>
<body>
<script>
var a = true;
document.write("a = ");
document.write(a); // true
result = !a;
document.write("<br>!a = ");
document.write(result); // false
</script>
</body>
</html>
ตารางความจริง (Truth Table)
| Operand | !Operand |
|---|---|
| true | false |
| false | true |
| 0 | true |
| 1 (non-zero) | false |
| "" (empty string) | true |
| "hello" (non-empty) | false |
| null | true |
| undefined | true |
| NaN | true |
| {} (object) | false |
| [] (array) | false |
การใช้งานทั่วไป
1. ตรวจสอบค่า Falsy
if (!value) {
// value คือ null, undefined, '', 0, false, NaN
console.log('Value is falsy');
}
2. Double NOT (!!) แปลงเป็น Boolean
!!"hello" // true
!!0 // false
!!null // false
!!undefined // false
!!{} // true
!![] // true
// เทียบเท่า Boolean()
Boolean("hello") // true
3. Toggle Boolean
let isVisible = true; isVisible = !isVisible; // false isVisible = !isVisible; // true
4. Default Value Pattern (เก่า)
// ก่อน ES6 default parameters
function greet(name) {
name = name || 'Guest'; // !name จะ true ถ้า name falsy
// ปัญหา: name = '' หรือ 0 จะกลายเป็น 'Guest'
}
// ES6 แนะนำ
function greet(name = 'Guest') { ... }
Operator Precedence
! มี precedence สูงมาก (รองจาก . [] () new)
!a + b // (!a) + b !(a + b) // ต้องใช้วงเล็บ
ข้อควรระวัง
[] == falseคือ true แต่![]คือ false (เพราะ [] เป็น truthy)![] == []คือ true (type coercion แปลกๆ)- ใช้
!!แทนBoolean()เพื่อความสั้น แต่อ่านยากกว่า