URL interface (Web API) ใช้สร้าง จัดการ และแยกวิเคราะห์ URL ได้อย่างง่ายดาย คลาสนี้รองรับในเบราว์เซอร์สมัยใหม่ทั้งหมด และ Node.js 10+ ตัวอย่างโค้ด { resEle.innerHTML += protocol = + url.protocol + <br>; // https: resEle.innerHTML += host = + url.host + <br>;

Arrow Functions (ES2015/ES6) เป็นรูปแบบเขียนฟังก์ชันสั้น (Shorthand) มีลักษณะเด่น: ไม่มี this binding ของตัวเอง — รับ this จากบริบทรอบนอก (Lexical this) ไม่มี arguments object ไม่สามารถใช้เป็น Constructor (new Arrow() error) ไม่มี prototype property ตัวอย่างโค้ด: เปรียบเทียบ Regular vs A

มี 3 วิธีหลักในการนำ JavaScript ไปใช้ใน HTML: Inline Script: เขียนโค้ดใน <script> โดยตรง External Script: อ้างอิงไฟล์ .js ด้วย <script src=...> ES Module: ใช้ <script type=module> รองรับ import/export ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <head>

JavaScript ไม่มี Enum (Enumerated Type) ในตัว เช่น TypeScript, Java, C# วิธีมาตรฐานคือใช้ Object แช่แข็ง (frozen) เพื่อสร้างชุดค่าคงที่ที่มีชื่อหมายเลขหรือสตริง ตัวอย่างโค้ด { resEle.innerHTML += Color.ORANGE = + Color.ORANGE + <br>; resEle.innerHTML += Color.RED = + Color.RED

window.history (History API) ให้ควบคุมประวัติการนำทางของแท็บเบราว์เซอร์ได้: ดูความยาว (length), ย้อนกลับ (back()), ไปข้างหน้า (forward()), ไปตำแหน่งเฉพาะ (go(n)) และใน HTML5 เพิ่ม pushState(), replaceState() สำหรับ SPA (Single Page Applications) ตัวอย่างโค้ด { window.history.back(); });

JavaScript เป็นภาษา prototype-based ทุกอ็อบเจกต์มี prototype เป็นโครงสร้างพื้นฐานของการสืบทอด (inheritance) Native Prototypes คือ prototypes ของ built-in objects เช่น Object.prototype, Array.prototype, String.prototype, Function.prototype ฯลฯ เราสามารถเพิ่มเมธอด/พร็อพเพอร์ตี้ใหม่เข้าไปได้ (Monkey P

Custom Errors (ข้อผิดพลาดแบบกำหนดเอง) ช่วยให้จัดการข้อผิดพลาดได้ละเอียดและมีความหมายมากกว่า Error ธรรมดา โดยการสร้างคลาสที่ extends Error พร้อมเพิ่มฟิลด์ เช่น code, statusCode, details เพื่อใช้ใน error handling, logging, และ API response ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <

JavaScript อนุญาตให้สร้างคลาสข้อผิดพลาดแบบกำหนดเอง (Custom Error) โดยการขยาย (extends) คลาส Error ในตัว วิธีที่ดีที่สุดคือสร้างคลาสลูกที่เรียก super(message) และตั้งค่า this.name ให้เป็นชื่อที่สื่อความหมาย เพื่อให้識別ง่ายใน catch และ stack trace ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th&g

CSS property pointer-events ควบคุมว่าอีเลเมนต์จะตอบสนองต่อเหตุการณ์เมาส์ (click, hover, drag ฯลฯ) ได้หรือไม่ ค่า none = ปิดการตอบสนอง (คลิกทะลุไปยังอีเลเมนต์ด้านหลัง) ค่า auto = เปิด (ค่าเริ่มต้น) สามารถเปลี่ยนผ่าน JavaScript ได้ด้วย element.style.pointerEvents ตัวอย่างโค้ด <!DOCTYPE html> &

การจัดกลุ่ม (Grouping) อาร์เรย์ของอ็อบเจกต์ตามคีย์ (เช่น id, age, category) ทำได้ง่ายด้วย Array.prototype.reduce() หรือใน ES2024 ใช้ Object.groupBy() (Stage 3 proposal, รองรับในเบราว์เซอร์ใหม่ๆ) ตัวอย่างโค้ด (Reduce - รองรับทุกเบราว์เซอร์) <!DOCTYPE html> <html lang=th> <head>

ใน JavaScript สามารถจับข้อยกเว้น (catch) แล้วโยนต่อ (re-throw) ได้ โดยใช้ throw err; ภายในบล็อก catch วิธีนี้ใช้เมื่อต้องการจัดการข้อผิดพลาดบางส่วน (เช่น log, cleanup) แล้วปล่อยให้โค้ดระดับนอกจัดการต่อ ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <head> <meta charset=UTF-8 /&

Destructuring ในพารามิเตอร์ฟังก์ชัน (Parameter Destructuring) ช่วยสกัดค่าจากอ็อบเจกต์หรืออาร์เรย์ที่ส่งเข้ามาโดยตรง ทำให้โค้ดสะอาด ลดการเขียน obj.prop ซ้ำๆ และรองรับค่าเริ่มต้น (default values) ได้ ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <head> <meta charset=UTF-8 />

TextEncoder แปลงสตริง (String) เป็น Uint8Array (ไบต์) ตามมาตรฐาน UTF-8 เท่านั้น TextDecoder ทำ العكس: แปลงไบต์ (Uint8Array, ArrayBuffer, DataView) กลับเป็นสตริง รองรับหลายเอนโคดิ้ง: UTF-8, UTF-16, ISO-8859-2, KOI8-R, GBK, ฯลฯ ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <head> &

ค่าเฉลี่ยเลขคณิต (Arithmetic Mean) คำนวณได้จากผลรวมของทุกค่า หารด้วยจำนวนสมาชิก สูตร: mean = sum / count ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, initial-scale=1.0 /> <title>ค

ค่ามัธยฐาน (Median) คือค่ากึ่งกลางของชุดข้อมูลที่เรียงลำดับแล้ว หากจำนวนข้อมูลเป็นคี่ คือค่าตรงกลาง หากเป็นคู่ คือค่าเฉลี่ยของค่ากึ่งกลาง 2 ค่า ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, i

การแปลงรูปภาพ (หรือทรัพยากรอื่นๆ) เป็น Blob ทำได้ง่ายด้วย fetch() แล้วตามด้วย response.blob() วิธีนี้เหมาะสำหรับดาวน์โหลดรูป แก้ไข แล้วอัปโหลด หรือสร้างไฟล์ให้ผู้ใช้ดาวน์โหลด ตัวอย่างโค้ด URL.revokeObjectURL(url), 10000); }) .catch(err => { resEle.innerHTML = เกิดข้อผ

ใน JavaScript มี 3 วิธีหลักในการเข้าถึงพร็อพเพอร์ตี้ของอ็อบเจกต์: Dot Notation (จุด) — object.property ใช้ได้เมื่อชื่อพร็อพเพอร์ตี้เป็นตัวระบุที่ถูกต้อง (ไม่มีช่องว่าง เริ่มต้นตัวอักษรหรือ _ หรือ $) Bracket Notation (วงเล็บเหลี่ยม) — object[property] ใช้ได้ทุกกรณี รองรับชื่อที่มีอักขระพิเศษ ตั

File และ FileReader เป็น API สำคัญในการจัดการไฟล์ฝั่งไคลเอนต์ (Client-side) โดยไม่ต้องอัปโหลดไปเซิร์ฟเวอร์ File สืบทอดมาจาก Blob และแทนไฟล์ที่ผู้ใช้เลือกผ่าน <input type=file> ส่วน FileReader ใช้อ่านเนื้อหาไฟล์แบบอะซิงโครนัส ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <head>

เมธอด Array.prototype.flat() ใช้สำหรับ แบน (flatten) อาร์เรย์ซ้อนหลายชั้นให้กลายเป็นอาร์เรย์ชั้นเดียว โดยสามารถระบุความลึก (depth) ได้ ค่าเริ่มต้นคือ 1 ตัวอย่างโค้ด <!DOCTYPE html> <html lang=th> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-

วัตถุ Blob (Binary Large Object) ใช้สำหรับแทนข้อมูลดิบ (raw data) ที่ไม่สามารถเปลี่ยนแปลงได้ (immutable) โดยมีคุณสมบัติ size (ขนาด) และ type (MIME type) เหมือนกับไฟล์ทั่วไป ไฟล์ (File) เป็นคลาสลูกที่สืบทอดมาจาก Blob ดังนั้น Blob จึงสามารถใช้ได้ในทุกที่ที่คาดหวังไฟล์ ตัวอย่างโค้ด <!DOCTYPE html&