본문으로 건너뛰기

JavaScript ยุคใหม่: ES6+ ฉบับเข้าใจง่าย

เรียนรู้ JavaScript สมัยใหม่ตั้งแต่พื้นฐานด้วย ES6+ พบกับฟีเจอร์สำคัญอย่าง `let`, `const`, Template Literals, Arrow Functions, Destructuring และอีกมากมาย พร้อมทั้งเข้าใจการจัดการ Asynchronous Code ด้วย Promises และ Async/Await เพื่อพัฒนาเว็บแอปพลิเคชันได้อย่างมีประสิทธิภาพ

ปานกลาง 짧은 문서 50개

เนื้อหาภาษาไทย / 태국어 콘텐츠

강의 목차 (Roadmap)

위에서 아래로 순서대로 따라 하세요
1

ตัวแปร const และ let ใน JavaScript

บทความนี้อธิบายความแตกต่างระหว่าง `var`, `let` และ `const` ใน JavaScript โดยเน้นที่ scope (ขอบเขตการใช้งาน) และ mutability (การเปลี่ยนแปลงค่า) ซึ่ง `let` และ `c...

2

การใช้งาน Template Literals

บทความนี้แนะนำ Template Literals ใน JavaScript ซึ่งเป็นวิธีการสร้าง string ที่ยืดหยุ่นกว่าเดิมโดยใช้ backtick (`) แทน quotes ธรรมดา ทำให้สามารถแทรกตัวแปรและ exp...

3

Arrow Functions อย่างละเอียด

บทความนี้เจาะลึกเรื่อง Arrow Functions ใน JavaScript ซึ่งเป็นวิธีการเขียนฟังก์ชันที่สั้นกว่า Function Expression แบบเดิม โดยมี syntax ที่กระชับและมีพฤติกรรมการ...

4

Default Parameters ในฟังก์ชัน

บทความนี้อธิบายถึงการใช้ Default Parameters ใน JavaScript ซึ่งเป็นการกำหนดค่าเริ่มต้นให้กับ parameters ของฟังก์ชัน ทำให้ฟังก์ชันทำงานได้แม้ไม่มี argument ที่สอด...

5

Rest Parameters

บทความนี้แนะนำ Rest Parameters ใน JavaScript ซึ่งเป็นวิธีรับ arguments จำนวนเท่าใดก็ได้ในฟังก์ชัน โดย arguments เหล่านั้นจะถูกรวบรวมเป็น array ทำให้ง่ายต่อการจั...

6

Spread Operator

บทความนี้แนะนำ Spread Operator ใน JavaScript ซึ่งใช้สัญลักษณ์ `...` เพื่อขยาย array หรือ object ออกเป็นส่วนประกอบย่อยๆ ทำให้สามารถ copy, รวม array/object, และส่...

7

Destructuring Assignment

บทความนี้แนะนำ Destructuring Assignment ใน JavaScript ซึ่งเป็น syntax ที่ช่วยให้ดึงค่าจาก array หรือ object ไปใส่ในตัวแปรได้ง่ายและรวดเร็ว โดยไม่ต้องเข้าถึงค่าด...

8

Object Literals Enhancement

บทความนี้แนะนำ Object Literals Enhancement ซึ่งเป็นฟีเจอร์ที่ช่วยให้การสร้าง Object ใน JavaScript ง่ายและกระชับขึ้นผ่าน Property Shorthand, Method Definition Sh...

9

การใช้งาน Array Methods: map, filter, reduce

บทความนี้ได้แนะนำ Array Methods ที่สำคัญใน JavaScript ได้แก่ `map`, `filter`, และ `reduce` ซึ่งเป็นฟังก์ชันที่ช่วยให้การจัดการและแปลงข้อมูลใน Array เป็นไปอย่างม...

10

การทำงานกับ Promises

บทความนี้กล่าวถึง Promises ใน JavaScript ซึ่งเป็นเครื่องมือสำคัญสำหรับการจัดการกับการทำงานที่ไม่พร้อมกัน (Asynchronous Programming) โดย Promises ช่วยให้โค้ดอ่าน...

11

Async/Await

บทความนี้แนะนำ `async/await` ซึ่งเป็น syntax sugar ที่ช่วยให้การเขียน Asynchronous Code ใน JavaScript ง่ายขึ้น โดยทำให้โค้ดดูเหมือน Synchronous และจัดการ error...

12

การจัดการ Error ใน JavaScript

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

13

การใช้งาน Modules ใน JavaScript

บทที่แล้วเราได้เรียนรู้เรื่องการจัดการ Error ใน JavaScript เพื่อให้โปรแกรมมีความเสถียร ในบทนี้จะกล่าวถึง Modules ซึ่งเป็นเครื่องมือสำคัญในการจัดระเบียบโค้ดให้เป...

14

การทำงานกับ JSON

บทความนี้กล่าวถึง JSON (JavaScript Object Notation) ซึ่งเป็นรูปแบบข้อมูลที่ใช้กันอย่างแพร่หลายในการแลกเปลี่ยนข้อมูลใน Web Application โดยอธิบายโครงสร้างพื้นฐานข...

15

Regular Expressions เบื้องต้น

บทความนี้ได้แนะนำ Regular Expressions (RegEx) ใน JavaScript ซึ่งเป็นเครื่องมือสำคัญสำหรับการค้นหา, จับคู่, และจัดการข้อความ โดยอธิบายถึง syntax พื้นฐาน, metacha...

17

การใช้งาน Math Object

บทความนี้กล่าวถึง `Math` Object ใน JavaScript ซึ่งเป็น Object ที่รวบรวม Properties และ Methods สำหรับการคำนวณทางคณิตศาสตร์ โดยเน้นที่การใช้งาน `Math.random()`,...

18

การใช้งาน DOM Manipulation

บทความนี้กล่าวถึงการ DOM Manipulation ซึ่งเป็นความสามารถในการปรับเปลี่ยนโครงสร้าง HTML ของหน้าเว็บผ่าน JavaScript โดยครอบคลุมตั้งแต่การเลือก elements ด้วย `quer...

19

Event Handling

บทความนี้อธิบายถึง Event Handling ใน JavaScript ซึ่งเป็นกระบวนการในการ "ฟัง" และตอบสนองต่อการกระทำของผู้ใช้บนหน้าเว็บ โดยใช้ `addEventListener()` เพื่อผูกฟังก์ช...

20

Local Storage และ Session Storage

บทความนี้ได้แนะนำ Local Storage และ Session Storage ซึ่งเป็น Web Storage APIs ที่ใช้สำหรับเก็บข้อมูลใน Browser โดย Local Storage เก็บข้อมูลแบบถาวร ในขณะที่ Sess...

21

Cookies

บทความนี้กล่าวถึง Cookies ซึ่งเป็นไฟล์ข้อความขนาดเล็กที่เว็บไซต์ใช้เก็บข้อมูลใน Browser เพื่อจดจำผู้ใช้ เช่น การตั้งค่าหรือข้อมูลการเข้าสู่ระบบ โดยสามารถสร้าง,...

22

Web Workers

บทความนี้แนะนำ Web Workers ซึ่งเป็น API ที่ช่วยให้รัน JavaScript ใน background thread ได้ ทำให้สามารถประมวลผลข้อมูลที่ซับซ้อนโดยไม่กระทบต่อ UI ของเว็บไซต์ และใน...

23

Fetch API

บทความนี้แนะนำ Fetch API ซึ่งเป็นวิธีที่ทันสมัยและยืดหยุ่นกว่า XMLHttpRequest ในการทำ HTTP requests ด้วย JavaScript เพื่อดึงข้อมูลจาก Server หรือ API อื่นๆ โดยค...

25

การใช้งาน URL API

บทความนี้แนะนำ URL API ใน JavaScript ซึ่งเป็นเครื่องมือที่มีประสิทธิภาพในการจัดการ URLs อย่างง่ายดายและมีประสิทธิภาพ ครอบคลุมตั้งแต่การสร้าง URL object, การเข้า...

26

Proxy Object

이 짧은 문서에서 상세 내용, 방법, 단계별 예시, 실무 적용 방법을 읽어 보세요.

27

Reflect API

บทความนี้แนะนำ Reflect API ซึ่งเป็นเครื่องมือสำหรับการตรวจสอบและจัดการ Object ใน JavaScript อย่างละเอียดและปลอดภัย โดยเฉพาะอย่างยิ่งเมื่อทำงานร่วมกับ Proxy API...

28

Generators

บทความนี้แนะนำ Generators ใน JavaScript ซึ่งเป็นฟังก์ชันพิเศษที่ใช้สร้าง iterators ได้อย่างง่ายดาย โดยใช้ `function*` และ keyword `yield` เพื่อหยุดและกลับมาทำงา...

29

Iterators and Iterables

บทความนี้อธิบายถึง Iterator และ Iterable protocols ใน JavaScript ซึ่งเป็นกลไกที่ทำให้ object สามารถวนซ้ำได้ โดย Iterator จะมี method `next()` ที่คืนค่า `value`...

30

Modules Patterns: Revealing Module Pattern

บทความนี้กล่าวถึง Revealing Module Pattern ซึ่งเป็นเทคนิคในการจัดการ scope และ encapsulation ใน JavaScript เพื่อป้องกัน Global Scope Pollution และทำให้โค้ดเป็นร...

31

Prototype Inheritance

บทความนี้อธิบายถึง Prototype Inheritance ซึ่งเป็นกลไกหลักที่ JavaScript ใช้ในการจำลองแนวคิด Object-Oriented Programming (OOP) โดย object สามารถสืบทอดคุณสมบัติจา...

32

Class Syntax

บทความนี้แนะนำ `class` syntax ใน JavaScript ซึ่งเป็น syntax sugar ที่ทำให้การเขียน Object-Oriented Programming (OOP) ง่ายขึ้น โดยยังคงอยู่บนพื้นฐานของ Prototype...

33

Static Methods and Properties

บทความนี้อธิบายการใช้งาน `static` methods และ properties ใน JavaScript classes ซึ่งเป็นคุณสมบัติที่ทำให้ methods และ properties เหล่านั้นเป็นของ class โดยตรง ไม...

34

Getter and Setter Methods

บทความนี้อธิบายถึง `getter` และ `setter` methods ใน JavaScript ซึ่งเป็นกลไกสำคัญในการควบคุมการเข้าถึงและแก้ไข properties ของ object เพื่อจุดประสงค์ต่างๆ เช่น กา...

35

Decorators

บทความนี้แนะนำ Decorators ใน JavaScript ซึ่งเป็นคุณสมบัติที่ช่วยเพิ่ม meta programming ให้กับคลาสและ methods โดยใช้ syntax `@decoratorName` เพื่อปรับเปลี่ยนหรือ...

36

WeakMap and WeakSet

บทความนี้แนะนำ `WeakMap` และ `WeakSet` ซึ่งเป็นโครงสร้างข้อมูลใน JavaScript ที่ต่างจาก `Map` และ `Set` ตรงที่การอ้างอิง (reference) ไปยัง keys/values เป็นแบบ "w...

37

Typed Arrays

บทความนี้แนะนำ Typed Arrays ใน JavaScript ซึ่งเป็นโครงสร้างข้อมูลที่มีประสิทธิภาพกว่า arrays ทั่วไปสำหรับการจัดการข้อมูลไบนารี โดย Typed Arrays ประกอบด้วย `Arra...

38

Atomics

บทความนี้แนะนำ Atomics API ซึ่งเป็นเครื่องมือสำหรับการจัดการ concurrency ใน JavaScript โดยใช้ SharedArrayBuffer เพื่อให้ threads สามารถเข้าถึงและแก้ไขข้อมูลร่วม...

39

Service Workers

บทความนี้แนะนำ Service Workers ซึ่งเป็น JavaScript script ที่ทำงานเบื้องหลังใน browser เพื่อสร้าง offline experience และเพิ่มประสิทธิภาพของเว็บไซต์ โดยอธิบายถึง...

40

WebAssembly

บทความนี้แนะนำ WebAssembly (Wasm) ซึ่งเป็น binary instruction format ที่ช่วยให้รัน code จากภาษาอื่น ๆ เช่น C++ หรือ Rust ใน browser ได้อย่างมีประสิทธิภาพสูงกว่า...

41

Internationalization API

บทความนี้แนะนำ Internationalization API (Intl) ใน JavaScript ซึ่งเป็นเครื่องมือที่ช่วยให้นักพัฒนาจัดการเรื่องภาษา, รูปแบบวันที่, ตัวเลข และการเรียงลำดับให้เหมาะ...

42

Resize Observer API

บทความนี้แนะนำ Resize Observer API ซึ่งเป็นเครื่องมือที่มีประสิทธิภาพในการตรวจจับการเปลี่ยนแปลงขนาดของ HTML Elements ได้อย่างแม่นยำและประหยัดทรัพยากรมากกว่าวิธี...

43

Intersection Observer API

บทความนี้แนะนำ Intersection Observer API ซึ่งเป็นเครื่องมือที่มีประสิทธิภาพในการตรวจจับการปรากฏของ Element ใน Viewport โดยไม่ต้องใช้เทคนิคที่สิ้นเปลืองทรัพยากรเ...

44

Performance API

บทความนี้แนะนำ Performance API ใน JavaScript ซึ่งเป็นชุดเครื่องมือสำหรับวัดและวิเคราะห์ประสิทธิภาพของเว็บแอปพลิเคชัน โดยเน้นการใช้งาน `performance.now()`, `perf...

45

Animation API

บทความนี้แนะนำ Animation API ซึ่งเป็นส่วนหนึ่งของ Web Animations API (WAAPI) ที่ช่วยให้สร้าง animations ที่ซับซ้อนและมีประสิทธิภาพสูงได้ โดยใช้ Animation Object...

46

Canvas API

บทความนี้แนะนำ Canvas API ซึ่งเป็นเครื่องมือที่ช่วยให้นักพัฒนาสามารถวาดภาพกราฟิก 2D บนเว็บเบราว์เซอร์ได้โดยใช้ JavaScript โดยเน้นที่การเข้าถึง Canvas Context เพ...

47

WebGL

บทความนี้แนะนำ WebGL ซึ่งเป็น API สำหรับสร้างกราฟิก 3D ในเบราว์เซอร์ โดยเน้นที่การสร้าง WebGL context, การใช้ shaders เพื่อควบคุมการแสดงผล, และการใช้ textures เ...

48

Node.js เบื้องต้น

บทความนี้เป็นการแนะนำ Node.js ซึ่งเป็น JavaScript runtime environment ที่ช่วยให้รัน JavaScript บน Server ได้ ทำให้สามารถพัฒนา Web Application ได้ทั้งฝั่ง Client...

49

ทดสอบ JavaScript ด้วย Jest

บทความนี้เป็นการแนะนำการทำ Unit Test ใน JavaScript ด้วย Jest ซึ่งเป็น Testing Framework ที่ได้รับความนิยมเนื่องจากใช้งานง่าย, รวดเร็ว และมี Mocking ในตัว โดยได้...

50

Best Practices ในการเขียน JavaScript

บทความนี้กล่าวถึงแนวทางปฏิบัติที่ดี (Best Practices) ในการเขียน JavaScript เพื่อให้โค้ดมีคุณภาพ, อ่านง่าย, บำรุงรักษาง่าย และมีประสิทธิภาพสูง โดยเน้นที่ Code St...