คำสั่ง if เป็น โครงสร้างควบคุมพื้นฐานที่สุด ให้ JavaScript ตัดสินใจรันโค้ดหรือไม่รันจากเงื่อนไข หากเงื่อนไขเป็น true รันบล็อกโค้ด มิฉะนั้นข้ามไป
ไวยากรณ์
if (condition) {
// รันเมื่อ condition เป็น true
}
// โค้ดต่อไปทำงานต่อปกติ
ตัวอย่างโค้ด
<html>
<body>
<script>
var age = 25;
if (age > 18) {
document.write("Eligible to vote!");
}
// ถ้า age <= 18 ไม่แสดงอะไรเลย
</script>
<p>Set the variable to different value and then try...</p>
</body>
</html>
การทำงาน
- ประเมิน
conditionให้เป็น Boolean (Truthy/Falsy) - ถ้า true: รันคำสั่งในบล็อก
{ } - ถ้า false: ข้ามบล็อก ไปคำสั่งถัดไปทันที
การใช้ Comparison Operators
ส่วนใหญ่ใช้ Comparison Operators ในเงื่อนไข:
| โอเปอเรเตอร์ | ความหมาย | ตัวอย่าง |
|---|---|---|
=== | เท่ากัน (ค่าและชนิด) | age === 18 |
!== | ไม่เท่ากัน | name !== "" |
>, >= | >, >= | score >= 50 |
<, <= | <, <= | age < 18 |
&& | AND (และ) | age > 18 && hasID |
|| | OR (หรือ) | isAdmin || isEditor |
รูปแบบย่อสำหรับคำสั่งเดียว
// ไม่แนะนำ (อ่านยาก บั๊กง่าย)
if (loggedIn) renderDashboard();
// แนะนำ: ใช้ block เสมอ
if (loggedIn) {
renderDashboard();
}
// หรือ ternary สำหรับค่า
var view = loggedIn ? "Dashboard" : "Login";
ข้อผิดพลาดที่พบบ่อย
if (x = 5)→ กำหนดค่า x=5 แล้ว true เสมอ (ควรเป็น===)- ลืม
{ }ทำให้แค่คำสั่งแรกอยู่ใน if - เงื่อนไขซับซ้อนเกินไป → แยกเป็นตัวแปรหรือฟังก์ชัน
แนวทางปฏิบัติที่ดี
- ใช้
===และ!==เสมอ - ใช้ Block
{ }เสมอ - ชื่อเงื่อนไขให้อ่านเป็นประโยค:
if (userCanEdit) - หลีกเลี่ยงการซ้อนเกิน 2-3 ระดับ
