Category: JavaScript

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

การเขียน JavaScript Syntax

JavaScript (JS) เป็นภาษาโปรแกรมที่ใช้งานได้หลายด้าน โดยเฉพาะในเว็บเบราว์เซอร์ เพื่อทำให้หน้าเว็บมีความโต้ตอบและมีฟังก์ชันที่หลากหลายขึ้น การเรียนรู้ Syntax ของ JavaScript เป็นเรื่องสำคัญเพราะมันเป็นโครงสร้างพื้นฐานที่ทำให้โปรแกรมทำงานได้ตามที่เราต้องการ

1. ตัวแปร (Variables)

ใน JavaScript สามารถประกาศตัวแปรได้โดยใช้คำสำคัญ var, let, หรือ const ซึ่ง let และ const เป็นวิธีที่แนะนำมากกว่า เนื่องจาก var มีปัญหาเรื่องการ scope ที่ไม่ชัดเจน

var ใช้ประกาศตัวแปรทั่วไป

var name = "John";  // ประกาศตัวแปร name

let ใช้สำหรับตัวแปรที่ต้องการเปลี่ยนค่าได้

let age = 25;  // สามารถเปลี่ยนค่าได้
age = 26;

const ใช้สำหรับตัวแปรที่ค่าคงที่ ไม่สามารถเปลี่ยนค่าได้

const pi = 3.14159;  // ไม่สามารถเปลี่ยนค่าได้

2. ชนิดข้อมูล (Data Types)

JavaScript รองรับหลายชนิดข้อมูล เช่น

String ข้อความ

let greeting = "Hello World!";

Number ตัวเลข (ทั้งจำนวนเต็มและทศนิยม)

let age = 30;
let price = 9.99;

การใช้งาน JavaScript Statements

JavaScript statements (คำสั่งในภาษา JavaScript) คือชุดคำสั่งที่ให้เบราว์เซอร์หรือโปรแกรมทำงานตามที่เราต้องการ โปรแกรมในภาษา JavaScript จะประกอบด้วยลำดับของ statements ซึ่งแต่ละคำสั่งจะบอกให้คอมพิวเตอร์ทำบางสิ่งบางอย่าง

โครงสร้างของ JavaScript Statements

แต่ละ statement ใน JavaScript มักจะประกอบด้วย

คำสั่ง (Command) สิ่งที่เราต้องการให้โปรแกรมทำ เช่น การกำหนดค่า การคำนวณ หรือการเรียกใช้ฟังก์ชัน
ตัวจบคำสั่ง (;) ส่วนใหญ่ใน JavaScript เราจะใช้เครื่องหมาย ; เพื่อจบแต่ละคำสั่ง (แต่ในหลายกรณีสามารถเว้นได้)

ตัวอย่าง

let name = "John";  // กำหนดตัวแปร name ให้มีค่าเป็น "John"
let age = 25;       // กำหนดตัวแปร age ให้มีค่าเป็น 25
console.log(name);  // แสดงค่า name บน console

ในตัวอย่างนี้ มี 3 statements

กำหนดตัวแปรชื่อ name และให้ค่าเป็น "John"
กำหนดตัวแปรชื่อ age และให้ค่าเป็น 25
แสดงผลตัวแปร name ผ่านทางฟังก์ชัน console.log

การแสดงผลลัพธ์ JavaScript

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

วิธีการแสดงผลใน JavaScript

การแสดงผลใน JavaScript มีหลายวิธีที่ใช้กันบ่อย ๆ เช่น

ใช้ console.log() วิธีนี้เป็นวิธีที่ง่ายที่สุดในการแสดงผลลัพธ์ไปยัง “คอนโซล” (Console) ของเบราว์เซอร์ ซึ่งคอนโซลเป็นเครื่องมือสำหรับนักพัฒนาเพื่อใช้ตรวจสอบหรือแสดงข้อความเพื่อดีบั๊กโค้ด

ตัวอย่างโค้ด

console.log("สวัสดีโลก!");

ผลลัพธ์: ข้อความ “สวัสดีโลก!” จะถูกแสดงในคอนโซลของเบราว์เซอร์ (สามารถเปิดคอนโซลได้ใน Developer Tools)

ใช้ alert() วิธีนี้จะแสดงข้อความในรูปแบบหน้าต่างป๊อปอัพ (alert box) บนเบราว์เซอร์ ซึ่งผู้ใช้จะต้องกดปุ่ม “ตกลง” (OK) เพื่อปิดหน้าต่างนี้

การเรียกใช้งาน JavaScript

ในการเขียนโค้ด JavaScript สิ่งที่สำคัญคือการเลือกตำแหน่งที่เหมาะสมในการวางโค้ด เพื่อให้สคริปต์ทำงานตามที่ต้องการ ในบทนี้เราจะอธิบายถึง 3 ตำแหน่งหลักที่สามารถใส่ JavaScript ได้ใน HTML

Internal JavaScript (เขียนภายในไฟล์ HTML)
External JavaScript (แยกไฟล์ JavaScript ออกมา)
In-line JavaScript (เขียนใน Attribute ของ HTML Tag)

1. Internal JavaScript (ภายในไฟล์ HTML)

การเขียนโค้ด JavaScript ภายในไฟล์ HTML สามารถทำได้โดยวางโค้ดภายในแท็ก <script> โดยทั่วไปนิยมวางไว้ที่ส่วน <head> หรือท้าย <body> ของเอกสาร HTML

ตัวอย่างการใส่ใน <head>

<!DOCTYPE html>
<html>
<head>
    <title>My Website</title>
    <script>
        document.write("Hello from the Head section!");
    </script>
</head>
<body>
    <h1>Welcome to My Website</h1>
</body>
</html>

JavaScript คืออะไร?

JavaScript (JS) คือภาษาการเขียนโปรแกรมที่ถูกออกแบบมาเพื่อใช้ในการพัฒนาเว็บแอปพลิเคชันแบบอินเทอร์แอคทีฟ โดยเป็นภาษาที่ทำงานฝั่งไคลเอนต์ (client-side) หมายความว่ามันทำงานบนเบราว์เซอร์ของผู้ใช้งานโดยตรง ต่างจากภาษาอื่นๆ อย่าง PHP ที่ทำงานฝั่งเซิร์ฟเวอร์ (server-side)

จุดกำเนิดและการพัฒนา

JavaScript ถูกพัฒนาขึ้นครั้งแรกในปี 1995 โดย Brendan Eich ขณะที่เขาทำงานที่ Netscape Communications (ผู้พัฒนาเว็บเบราว์เซอร์ Netscape) เป้าหมายหลักของมันคือการทำให้หน้าเว็บมีการโต้ตอบและตอบสนองมากขึ้น ซึ่งในช่วงแรกนั้นมีชื่อว่า LiveScript แต่ภายหลังถูกเปลี่ยนเป็น JavaScript เนื่องจากความนิยมของภาษา Java ในช่วงเวลานั้น แม้จะมีชื่อคล้ายกัน แต่ JavaScript กับ Java เป็นสองภาษาที่แตกต่างกันอย่างสิ้นเชิง