ก่อนมี Bitwise operator ต้องแปลงตัวเลขเป็นสตริงก่อน แล้วใช้ string method ตัด ตอนนี้ Bitwise OR (|) ทำให้ง่ายขึ้น ไม่ต้องแปลงชนิดข้อมูล ไม่ต้องใช้ string method วิธีเดิม ใช้ substring() <html> <body> <script> var str = 2345; document.write((str.substring(0, str.length -

ออเปอเรเตอร์ + ใช้ได้หลายอย่าง: บวกเลข ต่อสตริง และ แปลงชนิดข้อมูล (type conversion) โดยเฉพาะการแปลงสตริงเป็นตัวเลข ตัวอย่าง แปลงสตริงเป็นตัวเลข <html> <body> <script> var num = 23; int = +num; document.write(int); document.write(<br>); document.writ

Navigator Object Navigator Object ให้ข้อมูลเกี่ยวกับเบราว์เซอร์ เช่น สถานะออนไลน์/ออฟไลน์ รองรับ Java หรือไม่ เป็นต้น ตัวอย่างที่ 1: ตรวจสอบสถานะออนไลน์ <html> <body> <script> var x = Is your browser is in online mode? + navigator.onLine; document.write(x); </script

การเรียกใช้ฟังก์ชันมี 3 วิธี: 1) เป็นฟังก์ชัน 2) เป็นเมธอด 3) เป็น Function Constructor วิธีที่ 3 น่าสนใจเพราะใช้ inheritance - การสร้างออบเจ็กต์ใหม่ด้วย new จะสืบทอดพร็อพเพอร์ตี้และเมธอดจาก constructor ตัวอย่าง <html> <body> <script> function myArg(arg1, arg2) { thi

JavaScript มีเมธอด parseFloat() แปลงสตริงเป็น floating point number (ทศนิยม) ส่วน parseInt() แปลงเป็นจำนวนเต็มเท่านั้น ไวยากรณ์ parseFloat(value); ตัวอย่าง <html> <body> <script> var a = parseFloat( 100 ); document.write(a + <br>); var b = parseFloat(120.65);

ได้ สามารถเปลี่ยนเนื้อหา HTML ใน JavaScript โดยใช้ DOM methods เช่น document.getElementById(), document.getElementsByTagName() เพื่อเข้าถึงและแก้ไขแท็ก HTML ตัวอย่างที่ 1: เปลี่ยนเนื้อหาในแท็ก span <html> <body> <span id=change>Is javaScript is java.</span> <inp

JavaScript มีเมธอด addEventListener() สำหรับผูก event handler ให้กับอีเลเมนต์ โดยไม่เขียนทับ handler เดิม สามารถเพิ่มหลาย handler ให้อีเลเมนต์เดียวกันได้ และควบคุม event bubbling ได้ง่ายขึ้น ตัวอย่าง <html> <body> <p>This example uses the addEventListener() method to attach a mou

JavaScript มีเมธอด removeEventListener() สำหรับลบ event handler ที่ผูกไว้ด้วย addEventListener() ตัวอย่าง <html> <body> <h3 id=add>Hover me </h3> <p id=remove> </p> <h3>Click this button to stop hovering effect </h3> <input type

Math.hypot() Math.hypot() คำนวณรากที่สองของผลรวมกำลังสองของอาร์กิวเมนต์ที่ส่งเข้าไป ใช้หาความยาวด้านตรงข้ามมุมฉาก (hypotenuse) ของสามเหลี่ยมมุมฉาก ไวยากรณ์ Math.hypot(arg1, arg2, ...); ตัวอย่าง หาด้านตรงข้ามมุมฉาก <html> <body> <script> document.write(Math.hypot(7, 24));

_.size() _.size() จาก underscore.js ใช้หาขนาด (จำนวนอิลิเมนต์) ของอาร์เรย์ ต้องโหลด CDN ของ underscore.js ก่อนใช้งาน ไวยากรณ์ _.size(array); ตัวอย่างที่ 1: อาร์เรย์ทั่วไป <html> <body> <head> <script src=https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-mi

_.initial() _.initial() จาก underscore.js ใช้แยกอิลิเมนต์สุดท้ายออกจากอาร์เรย์ คืนค่าอาร์เรย์ที่ไม่รวมตัวสุดท้าย รับพารามิเตอร์ 2 ตัว: อาร์เรย์ และจำนวนอิลิเมนต์ที่ต้องการตัดจากขวา (optional) ไวยากรณ์ _.initial(array, n); ตัวอย่าง ตัดแค่ตัวสุดท้าย <html> <body> <script src=https://

_.rest() จาก underscore.js ใช้คืนค่าอิลิเมนต์ที่เหลือหลังจากตัดดัชนีที่ 0 ออก รับพารามิเตอร์ 2 ตัว คือ อาร์เรย์ และดัชนีเริ่มต้น (optional) ไวยากรณ์ _.rest(array, index); ตัวอย่าง ไม่ระบุดัชนีที่ 2 (ตัดแค่ตัวแรก) <html> <body> <script src=https://cdnjs.cloudflare.com/ajax/libs/unde

หากมีแค่สองอาร์เรย์ อาจใช้ตรรกะทั่วไปได้ แต่ถ้ามีหลายอาร์เรย์ จะซับซ้อนขึ้น เมธอด _.intersection() จาก underscore.js ช่วยให้ง่ายขึ้น โดยตรวจสอบทุกอิลิเมนต์และคืนค่าที่ซ้ำกันในทุกอาร์เรย์ หากมีอาร์เรย์ใดไม่มีค่าร่วมกัน จะได้ผลลัพธ์ว่าง ไวยากรณ์ _.intersection(array1, array2, ...); ตัวอย่าง <html

_.union() _.union() เป็นเมธอดของไลบรารี underscore.js ใช้รับอาร์เรย์หลายตัวและคืนค่าอาร์เรย์ใหม่ที่มีเฉพาะค่าที่ไม่ซ้ำกัน (union) จากทุกอาร์เรย์ที่ส่งเข้าไป ไวยากรณ์ _.union(array1, array2, ...); ตัวอย่าง <html> <body> <script src=https://cdnjs.cloudflare.com/ajax/libs/underscore.j

focus() เมธอด focus() ใน JavaScript ช่วยเน้น (highlight) อีเลเมนต์ฟอร์ม HTML โดยตั้งค่าให้เป็นอีเลเมนต์ที่ใช้งานอยู่ (active element) ในเอกสารปัจจุบัน สามารถใช้กับข้อความ ปุ่ม หรืออีเลเมนต์อื่นๆ ได้ ไวยากรณ์ element.focus(options); ตัวอย่าง ตัวอย่างต่อไปนี้ใช้ focus() กับแท็ก anchor ที่มี id=focus

พร็อพเพอร์ตี้ length ใช้ได้เฉพาะกับ อาร์เรย์ และ สตริง เท่านั้น เมื่อเรียกใช้กับ ออบเจ็กต์ จะได้ค่า undefined ตัวอย่าง <html> <body> <script> var object = {prop:1, prop:2}; document.write(object.length); </script> </body> </html> ผลลัพธ์ undefined ใน

เราสามารถกำหนด พร็อพเพอร์ตี้ ของออบเจ็กต์ได้โดยใช้ Dot notation และ Bracket notation นอกจากนี้ยังมีวิธีอีกวิธีหนึ่งคือการใช้ Object.defineProperty() เพื่อกำหนดพร็อพเพอร์ตี้ ซึ่งมักจะรับ 3 พารามิเตอร์ ได้แก่ ชื่อออบเจ็กต์ ชื่อพร็อพเพอร์ตี้ และพร็อพเพอร์ตี้ descriptor ไวยากรณ์ Object.defineProperty(o

Cloning คือ copy อาร์เรย์ไปอีกอาร์เรย์หนึ่ง แบบเก่าใช้ slice() แต่ ES6 มี spread operator (...) ทำให้ง่ายขึ้น Clone ด้วย slice() ตัวอย่าง slice() ตัดอาร์เรย์จาก index หนึ่งไปอีก index ไม่ระบุ index = ตัดทั้งอาร์เรย์ copy ไปอีกตัวด้วย assignment (=) <html> <body> <script>

ใช้ Exponentiation operator หาตัวเลขยกกำลัง อีกตัวหนึ่ง สัญลักษณ์ ** มี Math.pow() แล้วแต่ ** เป็นมาตรฐานหลายภาษา (Python, Ruby ฯลฯ) ข้อจำกัด Negative bases ต้องอยู่ใน parentheses มิฉะนั้นจะ error ตัวอย่างที่ 1 (Positive Base) <html> <body> <script> var res1 = Math.

Objects ไม่เหมือน arrays หรือ strings เปรียบเทียบด้วย === หรือ == ไม่ได้ ต้อง stringify ก่อน แล้วค่อยใช้ equality operators ตัวอย่าง: stringify objects ก่อน แล้วเปรียบเทียบ ตัวอย่างที่ 1 (Properties เรียงเหมือนกัน) <html> <body> <script> const obj1 = {Name: Rahim, C