Every program needs to react. A user clicks a button. An API returns data. A form field goes blank. Without a way to bra

ทุกโปรแกรมจำเป็นต้องมีการตอบสนอง ไม่ว่าจะเป็นเมื่อผู้ใช้คลิกปุ่ม, เมื่อ API ส่งข้อมูลกลับมา หรือเมื่อช่องกรอกข้อมูลในฟอร์มว่างเปล่า หากไม่มีวิธีการแยกเส้นทางการทำงาน โค้ดของคุณก็จะทำงานไปทีละบรรทัดโดยไม่สนใจว่าเกิดอะไรขึ้นจริง ๆ Conditionals (เงื่อนไข) ช่วยให้ JavaScript มีความสามารถในการเลือก พวกมันคือผู้ตัดสินใจภายในฟังก์ชันของคุณ เป็นเสมือนผู้เฝ้าประตูที่ตัดสินว่าอะไรควรทำงานและอะไรควรข้ามไป เมื่อคุณเข้าใจวิธีการเขียนเงื่อนไขที่ดี คุณจะเลิกเขียนสคริปต์ที่ตายตัว และเริ่มสร้างซอฟต์แวร์ที่ตอบสนองต่อสถานการณ์ต่าง ๆ ได้จริง

Why Conditionals Matter

Control flow คือกระดูกสันหลังของตรรกะ คุณใช้เงื่อนไขเพื่อตรวจสอบความถูกต้องของรหัสผ่านก่อนส่งไปยังเซิร์ฟเวอร์ คุณตรวจสอบว่ารถเข็นสินค้าว่างเปล่าหรือไม่ก่อนคำนวณภาษี หรือคุณตรวจจับว่าการร้องขอเครือข่ายล้มเหลวหรือไม่ เพื่อที่จะแสดงข้อความแสดงข้อผิดพลาดแทนที่จะเป็นหน้าจอว่างเปล่า สถานการณ์เหล่านี้ล้วนอาศัยแนวคิดง่าย ๆ อย่างเดียวกัน นั่นคือ: ประเมินบางสิ่ง แล้วจึงดำเนินการตามนั้น

หากไม่มีเงื่อนไข แอปพลิเคชันของคุณจะเป็นเหมือนการพูดคนเดียวมากกว่าการสนทนา มันจะไม่สามารถจัดการกับสถานการณ์ข้อมูลที่แตกต่างกัน จัดการข้อผิดพลาดได้อย่างราบรื่น หรือตอบสนองต่อการกระทำของผู้ใช้ได้อย่างมีความหมาย เงื่อนไขช่วยให้คุณควบคุมการทำงานของโปรแกรมภายใต้ความไม่แน่นอนในโลกความเป็นจริงได้

The Basic if Statement

จุดเริ่มต้นที่ง่ายที่สุดคือการใช้ if แบบเดี่ยว ๆ มันบอกว่า "ถ้าสิ่งนี้เป็นจริง ให้ทำงานนี้" เพียงแค่นั้น ไม่มีการสำรอง ไม่มีการเลือกเส้นทางอื่น

if (x % 2 === 0) {
    console.log("Even");
}

ในโค้ดส่วนนี้ ตัวดำเนินการ modulus จะตรวจสอบว่า x หารด้วยสองลงตัวหรือไม่ เมื่อเศษเป็นศูนย์ คอนโซลจะแสดงข้อความ (log) ออกมา หาก x เป็นเลขคี่ จะไม่มีอะไรเกิดขึ้น บล็อกนั้นจะถูกข้ามไปและโปรแกรมจะทำงานในบรรทัดถัดไปด้านล่าง

การข้ามไปอย่างเงียบ ๆ นั้นมีความสำคัญ บางครั้งคุณต้องการเพียงแค่ควบคุมการทำงานเพียงอย่างเดียว เช่น คุณอาจต้องการเพิ่ม CSS class ให้กับปุ่มเฉพาะเมื่อปุ่มนั้นอยู่ในสถานะ active หรือเพิ่มไอเทมลงใน array เฉพาะเมื่อข้อมูลที่กรอกไม่ว่างเปล่า คำสั่ง if แบบเดี่ยว ๆ สามารถจัดการช่วงเวลาเหล่านั้นได้โดยไม่ต้องบังคับให้คุณเขียนตรรกะที่คุณไม่จำเป็นต้องใช้

Adding an Alternative with if-else

การตัดสินใจในชีวิตจริงมักมีสองด้าน ไม่ว่าจะเป็นผู้ใช้มีอายุถึงเกณฑ์หรือไม่ก็ตาม หรือการชำระเงินสำเร็จหรือไม่สำเร็จ โครงสร้าง if-else ครอบคลุมทั้งสองกรณี

if (age >= 18) {
    console.log("Adult");
} else {
    console.log("Not an Adult");
}

บล็อก else จะดักจับทุกอย่างที่เงื่อนไขแรกปฏิเสธ มันสร้างทางแยกแบบสองทาง (binary branch) ที่ชัดเจน รูปแบบนี้ใช้งานได้ดีกับพวก toggle, การกำหนดสิทธิ์ (permissions) และ feature flags พยายามรักษาตรรกะภายในแต่ละบล็อกให้กระชับ หากคุณพบว่าตัวเองกำลังยัดงานหลายอย่างลงในทางแยกเดียว นั่นมักเป็นสัญญาณว่าควรแยกงานออกเป็นฟังก์ชันที่เล็กลง

Checking Multiple Paths with else if

ชีวิตไม่ค่อยมีแค่สองทางเลือกเสมอไป คุณอาจต้องจัดหมวดหมู่ตัวเลขว่าเป็นบวก ลบ หรือศูนย์ หรืออาจต้องกำหนดอัตราค่าขนส่งตามช่วงน้ำหนัก สำหรับการเปรียบเทียบหลายรายการอย่างเป็นลำดับ ให้ใช้ else if

if (x > 0) {
    console.log("Positive");
} else if (x < 0) {
    console.log("Negative");
} else {
    console.log("Zero");
}

JavaScript จะประเมินเงื่อนไขเหล่านี้จากบนลงล่าง ทันทีที่เงื่อนไขใดเงื่อนไขหนึ่งเป็นจริง มันจะทำงานในบล็อกนั้นและข้ามเงื่อนไขที่เหลือไป ลำดับจึงมีความสำคัญ หากคุณตรวจสอบ x > 0 หลังจากตรวจสอบ x > 100 การตรวจสอบที่เข้มงวดกว่าจะไม่ถูกทำงานเลย เพราะเงื่อนไขที่กว้างกว่าจะดักจับไปก่อน ให้คิดว่า else if คือรายการลำดับความสำคัญ

The switch Statement

เมื่อคุณต้องเปรียบเทียบค่าหนึ่งกับตัวเลือกที่แตกต่างกันหลาย ๆ อย่าง การใช้ else if ต่อกันยาว ๆ อาจดูซ้ำซาก คำสั่ง switch จะช่วยจัดการเรื่องนี้ให้สะอาดขึ้น โดยจะจับคู่ expression กับ case ต่าง ๆ และทำงานในบล็อกที่ตรงกัน

switch (true) {
    case marks >= 90:
        Branch = "Computer science";
        break;
    case marks >= 80:
        Branch = "Mechanical";
        break;
    default:
        Branch = "Other";
}

ตัวอย่างนี้ใช้ switch(true) เพื่อประเมินเงื่อนไขแบบ boolean โดยตรง ซึ่งเป็นรูปแบบที่พบบ่อยใน JavaScript เมื่อตรรกะของคุณขึ้นอยู่กับช่วงของค่า (ranges) มากกว่าการเปรียบเทียบความเท่ากันแบบเป๊ะ ๆ คำสำคัญ break นั้นจำเป็นมาก หากไม่มีมัน การทำงานจะไหลลงไปยัง case ถัดไปโดยไม่สนใจว่าเงื่อนไขจะตรงกันหรือไม่ ซึ่งมักไม่ใช่สิ่งที่คุณต้องการ ส่วนของ default จะทำหน้าที่เหมือน else ตัวสุดท้าย โดยจะดักจับทุกอย่างที่ไม่ตรงกับ case ก่อนหน้า

switch จะโดดเด่นมากเมื่อคุณมีตัวเลือกที่ชัดเจนและตายตัว มันมักจะอ่านง่ายกว่าการวางบล็อก else if ซ้อนกันสูง ๆ โดยเฉพาะเมื่อแต่ละทางแยกทำเพียงแค่กำหนดค่าหรือเรียกใช้ฟังก์ชันเดียว

The Ternary Operator

สำหรับการตัดสินใจแบบสองทางสั้น ๆ ตัวดำเนินการ ternary จะช่วยให้โค้ดกระชับขึ้น โดยประกอบด้วย 3 ส่วน (operands): เงื่อนไข, ค่าหากเป็นจริง และค่าหากเป็นเท็จ

const result = (age >= 18) ? "Eligible" : "Not eligible";

คุณสามารถใช้มันสำหรับการกำหนดค่าอย่างรวดเร็วหรือการ return ค่าแบบ inline ได้ดี เมื่อผลลัพธ์เป็น expression ที่เรียบง่าย อย่าพยายามเขียน ternary ซ้อนกันลึกถึงสามชั้น แม้การเขียน ternary ซ้อนกันอาจช่วยประหยัดบรรทัด แต่ต้องแลกมาด้วยความยากในการอ่าน เมื่อตรรกะของคุณซับซ้อนขึ้น การใช้บล็อก if-else มักจะเป็นมิตรต่อโปรแกรมเมอร์คนถัดไปที่จะมาเปิดไฟล์นี้มากกว่า

Nested Decisions

ตรรกะที่ซับซ้อนบางครั้งจำเป็นต้องมีการถามคำถามเพิ่มเติม คุณสามารถซ้อน if ไว้ภายใน if อีกตัวหนึ่งเพื่อช่วยในการตัดสินใจให้ละเอียดขึ้น

if (weather === "sunny") {
    if (temp > 30) {
        console.log("