ใช้ encodeURI() สำหรับเข้ารหัส URL ทั้งหมด และ encodeURIComponent() สำหรับเข้ารหัสส่วนประกอบ (query params, path segments) ตัวอย่างจากบทความ <!DOCTYPE html> <html> <body> <button onclick="display()">Encode</button> <p id="demo"></

javascript:void(0) ดีกว่า # เพราะเร็วกว่า ไม่ทำให้หน้าจอกระโดด และไม่เปลี่ยน URL history ตัวอย่างจากบทความ <!DOCTYPE html> <html> <head> <title>Understanding JavaScript void(0)</title> </head> <body> <a href="javascript:void(0);"

Prefix Increment (++a) และ Postfix Increment (a++) เพิ่มค่าตัวแปรทีเดียวกัน แต่ค่าที่คืนกลับต่างกัน ความแตกต่างหลัก Operatorชื่อค่าที่คืนค่าตัวแปรหลังทำงาน ++aPre-incrementค่า หลัง เพิ่มแล้วเพิ่มขึ้น 1 a++Post-incrementค่า ก่อน เพิ่มเพิ่มขึ้น 1 ตัวอย่างจากบทความ <html&

ใช้ window.onload หรือ DOMContentLoaded เพื่อเรียกฟังก์ชันเมื่อหน้าเว็บโหลดเสร็จ ตัวอย่างจากบทความ (window.onload) <!DOCTYPE html> <html> <body> <script> function alertFunction() { alert(ok); } window.onload = alertFunction; </script>

eval() ใช้รันโค้ดจากสตริง แต่มีปัญหาสำคัญ 3 ข้อ: ช้า, ไม่ปลอดภัย, ยากต่อการ Debug ตัวอย่างการใช้งาน (เพื่อการศึกษา) <html> <body> <script> var a = 30; var b = 12; var res1 = eval("a * b") + "<br>"; var res2 = eval("5 + 1

เรียกหลายฟังก์ชันใน onclick ได้โดยคั่นด้วย Semicolon (;) ไวยากรณ์ onclick=function1(); function2(); function3() ตัวอย่างจากบทความ <html> <head> <script> function Display1() { document.write("Hello there!"); } function Display2() {

ใช้ Default Parameters (ES6) เพื่อกำหนดค่าเริ่มต้นและตรวจสอบว่ามีการส่ง argument มาหรือไม่ ตัวอย่างจากบทความ <!DOCTYPE html> <html> <body> <script> function display(arg1 = Tutorials, arg2 = Learning) { document.write(arg1 + + arg2 + <br>); }

Leading Bang (!) หรือสัญลักษณ์นำหน้าอื่นๆ (+, -, ~) ใช้เพื่อบังคับให้ Function Declaration กลายเป็น Function Expression เพื่อให้สามารถเรียกใช้ทันที (IIFE) ได้ รูปแบบต่างๆ !function(){ /* code */ }(); +function(){ /* code */ }(); -function(){ /* code */ }(); ~function(){ /* code */ }(); void fun

DateTime ใน JavaScript และ Python มีความแตกต่างสำคัญ 2 จุดที่ต้องระวังเมื่อส่งข้อมูลข้ามภาษา 1. ความแตกต่างของเดือน (Month Index) JavaScript: เดือน 0-11 (มกราคม = 0, ธันวาคม = 11) Python: เดือน 1-12 (มกราคม = 1, ธันวาคม = 12) // JavaScript new Date(2017, 11, 1) // 1 ธันวาคม 2017 (เดือน 11 = ธันวา

ส่ง argument ให้ callback ของ setTimeout() ได้โดยตรงในพารามิเตอร์ที่ 3 ขึ้นไป (รองรับในเบราว์เซอร์สมัยใหม่ทุกตัว) ไวยากรณ์ setTimeout(functionName, milliseconds, arg1, arg2, arg3...) ตัวอย่างจากบทความต้นฉบับ <!DOCTYPE html> <html> <body> <button onclick="timeFunctio

Ternary Operator (Conditional Operator) เป็นออเปอเรเตอร์ที่รับ 3 operand (ตัวถูกกระทำ) เพื่อตัดสินใจเลือกค่าระหว่าง 2 ทางเลือก ตามเงื่อนไข ไวยากรณ์ condition ? valueIfTrue : valueIfFalse ส่วนคำอธิบาย conditionเงื่อนไขที่ประเมินเป็น true/false ?ถ้า true ให้ค่าด้านซ้าย :ถ้า

ใช้ property function.caller เพื่อดูว่าฟังก์ชันไหนเป็นตัวเรียกฟังก์ชันปัจจุบัน หมายเหตุ: เป็น non-standard feature และ obsolete ใน strict mode ตัวอย่างการใช้งาน <html> <head> <script type="text/javascript"> function Display() { alert("caller is &

การห่อโค้ด JavaScript ทั้งไฟล์ใน IIFE (Immediately Invoked Function Expression) หรือ Self-Executing Anonymous Function มีจุดประสงค์หลักเพื่อสร้าง Namespace และควบคุม Visibility ของตัวแปรและฟังก์ชัน ไวยากรณ์ (Syntax) (function() { // code })(); การทำงานแยกส่วน function() { ... } - Function Exp

ใช้ Chrome Developer Tools เพื่อค้นหาตำแหน่งที่ประกาศฟังก์ชัน JavaScript ได้อย่างรวดเร็ว ขั้นตอนการค้นหา เปิด DevTools - กด F12 หรือ Ctrl+Shift+I (Windows/Linux) / Cmd+Option+I (Mac) เปิด Search ทั่วโปรเจกต์ - กด Ctrl+Shift+F (Windows/Linux) / Cmd+Option+F (Mac) เปิด Regular Expression - คล

Generator Function (ประกาศด้วย function*) เป็นฟังก์ชันพิเศษที่สามารถหยุดทำงานชั่วคราว (pause) และกลับมาทำงานต่อ (resume) ได้ คืนค่า Generator object ที่ควบคุมการทำงานได้ ไวยากรณ์ (Syntax) function *myGenerator() {} // หรือ function* myGenerator() {} // หรือ function*myGenerator() {} ตัวอย่างพื้

ใช้ typeof operator ตรวจสอบว่าฟังก์ชันมีอยู่จริงหรือไม่ ก่อนจะเรียกใช้ เพื่อป้องกัน Error ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <script> function display() { alert("Hello World!"); } if (typeof display === function)

IIFE (Immediately Invoked Function Expression) หรือ (function() { })() เป็นฟังก์ชันที่ถูกสร้างและเรียกใช้ทันทีในจุดเดียวกัน ใช้สร้าง scope แบบ isolate ไม่ให้ตัวแปรรั่วไหลไปสู่ global scope ไวยากรณ์ (Syntax) (function() { // code })(); การทำงานแยกส่วน function() { ... } - Function Expression (

ฟังก์ชัน eval() ใช้สำหรับประเมินและรันโค้ด JavaScript ที่อยู่ในรูปแบบสตริง แต่ไม่แนะนำให้ใช้ เนื่องจากปัญหาด้านประสิทธิภาพและความปลอดภัย ตัวอย่างการใช้งาน (เพื่อการศึกษาเท่านั้น) <html> <body> <script> var a = 30; var b = 12; var res1 = eval("a * b&quo

เมื่อมีชื่อฟังก์ชันอยู่ในรูปแบบสตริง สามารถเรียกใช้ได้หลายวิธี ขึ้นอยู่กับบริบท (global, object, class) 1. ฟังก์ชัน Global (อยู่ใน window object) function myFunction() { console.log(Hello!); } var funcName = myFunction; window[funcName](); // เรียกใช้ได้ 2. เมธอดใน Object/Class (ตัวอย่างจากบทคว

ใช้เมธอด split() เพื่อแบ่งสตริงเป็นอาร์เรย์ตามตัวคั่น (delimiter) ที่กำหนด แล้วนำมารวมกลับด้วย join() พร้อมตัวคั่นใหม่ ตัวอย่างการใช้งาน <!DOCTYPE html> <html> <body> <h2>เพิ่มการขึ้นบรรทัดใหม่</h2> <script> var myArray = This is demo text 1!~This