JavaScript คืออะไร

  1. ประวัติของจาวาสคริปต์
    1.1 กำเนิดจาวาสคริปต์
    1.2 การกำหนดมาตรฐานและข้อกำหนด ECMAScript
    1.3 สงครามเบราว์เซอร์และการยอมรับ (Adoption) จาวาสคริปต์
  2. บทบาทของ JavaScript ในการทำเว็บ
    2.1 สคริปต์ฝั่งไคลเอนต์ (Client-side Scripting)
    2.2 การเขียนสคริปต์ฝั่งเซิร์ฟเวอร์ (Server-side Scripting)
    2.3 การทำแอพมือถือและเดสก์ท็อป
    2.4 Internet of Things (IoT) และระบบแบบฝังตัว (Embedded Systems)
  3. JavaScript พื้นฐาน
    3.1 ตัวแปร (Variables) ชนิดข้อมูล (Data Types) และตัวดำเนินการ (Operators)
    3.2 โครงสร้างการควบคุม (Control Structures)
    3.3 ฟังก์ชั่น (Functions)
    3.4 วัตถุ (Objects) และการเขียนโปรแกรมเชิงวัตถุ (Object-Oriented Programming)
    3.5 การจัดการ DOM
    3.6 การเขียนโปรแกรมแบบอะซิงโครนัส (Asynchronous Programming)

JavaScript เป็นภาษาการเขียนโปรแกรมที่หลากหลาย ทรงพลัง และแพร่หลายซึ่งใช้สำหรับการทำเว็บ ตั้งแต่เริ่มก่อตั้งในปี 1995 JavaScript ได้กลายเป็นเครื่องมือสำคัญสำหรับการทำเว็บแบบโต้ตอบและไดนามิก โดยขับเคลื่อนทั้งส่วนหน้า (front-end) และส่วนหลัง (back-end) ของการทำแอพจำนวนนับไม่ถ้วน บทความนี้จะเจาะลึกถึงต้นกำเนิดของ JavaScript สำรวจบทบาทในการทำเว็บ และให้ภาพรวมระดับสูงของคุณสมบัติพื้นฐานของภาษา เมื่อคุณอ่านบทนำที่ครอบคลุมนี้ คุณจะพบลิงก์ไปยังเนื้อหาที่เกี่ยวข้องซึ่งจะช่วยให้คุณเรียนรู้และเชี่ยวชาญ JavaScript

1. ประวัติของจาวาสคริปต์

1.1 กำเนิดจาวาสคริปต์

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

เป็นที่น่าสังเกตว่า JavaScript ไม่เกี่ยวข้องกับ Java แม้ว่าจะมีความคล้ายคลึงกันในชื่อก็ตาม การตัดสินใจตั้งชื่อภาษาว่า “JavaScript” ส่วนใหญ่เป็นความเคลื่อนไหวทางการตลาด โดยใช้ประโยชน์จากความนิยมของ Java ในขณะนั้น

1.2 การกำหนดมาตรฐานและข้อกำหนด ECMAScript

เพื่อให้แน่ใจว่าลักษณะการทำงานที่สอดคล้องกันในการใช้งานต่างๆ JavaScript จำเป็นต้องมีข้อมูลจำเพาะที่เป็นมาตรฐาน ในปี 1997 Netscape ได้ส่ง JavaScript ไปยังสมาคมผู้ผลิตคอมพิวเตอร์แห่งยุโรป (ECMA) เพื่อกำหนดมาตรฐาน JavaScript รุ่นมาตรฐานเรียกว่า ECMAScript และรุ่นแรกของข้อกำหนด ECMAScript หรือที่รู้จักในชื่อ ES1 เปิดตัวในเดือนมิถุนายน 1997

ตั้งแต่นั้นเป็นต้นมา ECMAScript ได้รับการแก้ไขหลายครั้ง โดยการอัปเดตที่สำคัญที่สุดคือการเปิดตัว ECMAScript 2015 (ES6) ES6 นำเสนอคุณสมบัติใหม่และการปรับปรุงไวยากรณ์มากมายที่กลายเป็นส่วนสำคัญของการทำเว็บ JavaScript สมัยใหม่ ขณะนี้ข้อกำหนด ECMAScript ได้รับการอัปเดตเป็นประจำทุกปี โดยเวอร์ชันใหม่แต่ละเวอร์ชันจะรวมคุณลักษณะและการปรับปรุงใหม่ๆ ไว้ด้วย

1.3 สงครามเบราว์เซอร์และการยอมรับ (Adoption) จาวาสคริปต์

ในช่วงปลายทศวรรษ 1990 และต้นทศวรรษ 2000 การแข่งขันที่ดุเดือดที่เรียกว่า “Browser Wars” เกิดขึ้นระหว่าง Netscape Navigator และ Internet Explorer ของ Microsoft JavaScript มีบทบาทสำคัญในการแข่งขันนี้ เนื่องจากทั้งสองบริษัทพยายามใช้คุณสมบัติใหม่และการปรับปรุงเพื่อดึงดูดผู้ใช้

Microsoft พัฒนา JavaScript เวอร์ชันของตัวเองที่เรียกว่า JScript ซึ่งรวมอยู่ใน Internet Explorer JScript ส่วนใหญ่เข้ากันได้กับ JavaScript แต่มีความแตกต่างในการนำไปใช้ซึ่งนำไปสู่ความไม่สอดคล้องกันระหว่างสองภาษา

เมื่อความนิยมของ JavaScript เพิ่มขึ้น ผู้ให้บริการเบราว์เซอร์รายอื่นก็เริ่มใช้การสนับสนุนสำหรับภาษานี้ การเพิ่มขึ้นของเบราว์เซอร์โอเพ่นซอร์ส เช่น Firefox, Chrome และ Safari ช่วยสร้าง JavaScript ให้เป็นมาตรฐานโดยพฤตินัยสำหรับการเขียนโปรแกรมเว็บ

2. บทบาทของ JavaScript ในการทำเว็บ

2.1 สคริปต์ฝั่งไคลเอนต์ (Client-side Scripting)

จุดประสงค์เริ่มต้นของ JavaScript คือการเปิดใช้งานสคริปต์ฝั่งไคลเอ็นต์ ช่วยให้นักพัฒนาสามารถสร้างเนื้อหาเชิงโต้ตอบและไดนามิกบนหน้าเว็บ สิ่งนี้เกี่ยวข้องกับการจัดการ Document Object Model (DOM) ซึ่งเป็นโครงสร้างแบบต้นไม้ที่แสดงองค์ประกอบ HTML ของหน้าเว็บ

ด้วย JavaScript นักพัฒนาสามารถ:
  • ตอบสนองต่อการโต้ตอบของผู้ใช้ (เช่น การคลิกปุ่ม การส่งแบบฟอร์ม)
  • แก้ไขรูปลักษณ์และเนื้อหาของหน้าเว็บแบบเรียลไทม์
  • ตรวจสอบการป้อนข้อมูลของผู้ใช้และให้ข้อเสนอแนะ
  • สร้างภาพเคลื่อนไหวและการเปลี่ยนภาพ
  • โหลดเนื้อหาใหม่โดยไม่รีเฟรชหน้า (AJAX)
2.2 การเขียนสคริปต์ฝั่งเซิร์ฟเวอร์ (Server-side Scripting)

แม้ว่าเดิมที JavaScript ได้รับการออกแบบมาสำหรับการเขียนสคริปต์ฝั่งไคลเอนต์ แต่หลังจากนั้นก็พัฒนาเป็นเครื่องมือที่ทรงพลังสำหรับการพัฒนาฝั่งเซิร์ฟเวอร์ ในปี 2009 Ryan Dahl ได้สร้าง Node.js ซึ่งเป็นแพลตฟอร์มที่อนุญาตให้ JavaScript ทำงานบนฝั่งเซิร์ฟเวอร์ Node.js ใช้เครื่องมือ JavaScript V8 ของ Google และจัดเตรียมโมเดล I/O ที่ขับเคลื่อนด้วยเหตุการณ์และไม่ปิดกั้น ทำให้เหมาะสำหรับการทำแอพที่ปรับขนาดได้และใช้ข้อมูลจำนวนมาก

การใช้ JavaScript สำหรับการพัฒนาฝั่งเซิร์ฟเวอร์มีข้อดีหลายประการ:
  • การพัฒนาแบบฟูลสแตก (Full-stack) : นักพัฒนาสามารถใช้ภาษาเดียวสำหรับทั้งการพัฒนาส่วนหน้าและส่วนหลัง ทำให้กระบวนการทำเว็บคล่องตัวขึ้นและลดการสลับบริบท
  • ระบบนิเวศที่สมบูรณ์ (Rich ecosystem): ชุมชน Node.js ได้สร้างแพ็คเกจและโมดูลมากมายที่สามารถรวมเข้ากับการทำแอพได้อย่างง่ายดาย ให้ฟังก์ชันการทำงานที่สร้างไว้ล่วงหน้าและเร่งการทำเว็บ
  • อะซิงโครนัส (Asynchronous) และขับเคลื่อนด้วยเหตุการณ์ (event-driven): ธรรมชาติที่ขับเคลื่อนด้วยเหตุการณ์แบบไม่ปิดกั้นของ JavaScript ทำให้เหมาะอย่างยิ่งสำหรับการจัดการการเชื่อมต่อพร้อมกันและทำแอพแบบเรียลไทม์ เช่น การทำแอพแชทและเกมออนไลน์
2.3 การทำแอพมือถือและเดสก์ท็อป

JavaScript ได้ขยายออกไปนอกเหนือการทำเว็บ ด้วยเฟรมเวิร์กและไลบรารีที่ช่วยให้นักพัฒนาสามารถทำ แอพมือถือและเดสก์ท็อปโดยใช้ภาษาดังกล่าว เครื่องมือยอดนิยม เช่น React Native, Ionic และ Electron ช่วยให้นักพัฒนาทำแอพข้ามแพลตฟอร์มด้วย JavaScript ลดความจำเป็นในการเรียนรู้ภาษาโปรแกรมเฉพาะแพลตฟอร์ม เช่น Swift (iOS) หรือ Java (Android)

2.4 Internet of Things (IoT) และระบบแบบฝังตัว (Embedded Systems)

ความยืดหยุ่นของ JavaScript และระบบนิเวศที่กว้างขวางยังนำไปสู่การยอมรับในขอบเขตของ IoT และระบบฝังตัว แพลตฟอร์มเช่น Johnny-Five, Cylon.js และ Espruino ช่วยให้นักพัฒนาสามารถควบคุมและโต้ตอบกับอุปกรณ์ฮาร์ดแวร์โดยใช้ JavaScript ทำให้สามารถทำแอพ IoT ที่ซับซ้อนด้วยภาษาที่คุ้นเคย

3. JavaScript พื้นฐาน

3.1 ตัวแปร (Variables) ชนิดข้อมูล (Data Types) และตัวดำเนินการ (Operators)

JavaScript เป็นภาษาที่พิมพ์อย่างอิสระ ซึ่งหมายความว่าคุณไม่จำเป็นต้องประกาศประเภทข้อมูลของตัวแปรอย่างชัดเจน ภาษารองรับประเภทข้อมูลต่างๆ รวมถึงตัวเลข สตริง บูลีน ออบเจกต์ และอาร์เรย์ JavaScript ยังมีตัวดำเนินการ (Operators) ที่หลากหลายสำหรับการดำเนินการทางคณิตศาสตร์ การเปรียบเทียบ ตรรกะ และระดับบิต

3.2 โครงสร้างการควบคุม (Control Structures)

โครงสร้างการควบคุมเป็นรากฐานของภาษาการเขียนโปรแกรม และ JavaScript ก็ไม่มีข้อยกเว้น ภาษานำเสนอโครงสร้างการควบคุมทั่วไป เช่น คำสั่ง if-else สำหรับการดำเนินการตามเงื่อนไข และ for, while และ do- while สำหรับการวนซ้ำ นอกจากนี้ JavaScript ยังสนับสนุนเทคนิคการวนซ้ำขั้นสูงโดยใช้โครงสร้าง for…in, for…of และ Array.prototype.forEach()

3.3 ฟังก์ชั่น (Functions)

ฟังก์ชันเป็นบล็อกโค้ดที่ใช้ซ้ำได้ซึ่งสามารถกำหนดและเรียกตามชื่อได้ พวกมันทำหน้าที่เป็นหน่วยการสร้างของโปรแกรม JavaScript และสามารถใช้เพื่อจัดระเบียบโค้ด สร้างการปิด และกำหนดลักษณะการทำงานแบบกำหนดเอง ฟังก์ชันใน JavaScript สามารถประกาศเป็นฟังก์ชันที่มีชื่อ (named functions) ฟังก์ชันนิรนาม (anonymous functions) หรือฟังก์ชันลูกศร (arrow functions) (ใช้ได้ใน ES6)

3.4 วัตถุ (Objects) และการเขียนโปรแกรมเชิงวัตถุ (Object-Oriented Programming)

JavaScript เป็นภาษาเชิงวัตถุ ใช้วัตถุ (Objects) เพื่อแสดงโครงสร้างข้อมูลที่ซับซ้อนและพฤติกรรมที่เกี่ยวข้อง ภาษานี้รองรับการสืบทอด (inheritance) ผ่านเชนต้นแบบ (prototypal chains) และเริ่มต้นด้วย ES6 แนะนำไวยากรณ์ของคลาสสำหรับการกำหนดอ็อบเจกต์และต้นแบบ (prototypes) นอกจากนี้ยังสามารถสร้างวัตถุ JavaScript โดยใช้สัญกรณ์ตัวอักษรของวัตถุหรือตัวสร้างวัตถุ

3.5 การจัดการ DOM

Document Object Model (DOM) เป็นตัวแทนแบบต้นไม้ (tree-like representation) ของเอกสาร HTML และ JavaScript จัดเตรียมวิธีการสำหรับการเลือก แก้ไข และโต้ตอบกับองค์ประกอบ DOM งานทั่วไปรวมถึงการเพิ่มและลบองค์ประกอบ การเปลี่ยนแอตทริบิวต์และสไตล์ และการแนบตัวรับฟังเหตุการณ์ (event listeners) เพื่อตอบสนองต่อการโต้ตอบของผู้ใช้

3.6 การเขียนโปรแกรมแบบอะซิงโครนัส (Asynchronous Programming)

การเขียนโปรแกรมแบบอะซิงโครนัสเป็นคุณลักษณะที่สำคัญของ JavaScript ซึ่งช่วยให้นักพัฒนาสามารถดำเนินการแบบไม่ปิดกั้น เช่น การอ่านจากไฟล์หรือการร้องขอ HTTP JavaScript มีกลไกหลายอย่างในการจัดการการทำงานแบบอะซิงโครนัส รวมทั้งการเรียกกลับ สัญญา และ async/await (เปิดตัวใน ES2017)


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

เมื่อเข้าใจประวัติและบทบาทของ JavaScript ในการทำเว็บ ตลอดจนคุณสมบัติพื้นฐาน คุณก็สามารถเริ่มต้นเส้นทางสู่การเป็นนักพัฒนา JavaScript ที่มีทักษะได้ อย่าลืมสำรวจเนื้อหาที่เกี่ยวข้องที่ลิงก์ตลอดทั้งบทความนี้เพื่อเจาะลึกในหัวข้อเฉพาะและเพิ่มพูนความรู้ JavaScript ของคุณ


JavaScript คือ

JavaScript คือ ตอนที่ 1 : การตั้งค่าสภาพแวดล้อม (Setting Up Environment)
JavaScript คือ ตอนที่ 2 : ตัวแปร (Variables) และฟังก์ชั่น (Functions)
JavaScript คือ ตอนที่ 3 : ออบเจกต์ (Objects) และอาร์เรย์ (Arrays)
JavaScript คือ ตอนที่ 4 : DOM คืออะไร
JavaScript คือ ตอนที่ 5 : การเขียนโปรแกรมแบบซิงโครนัส (Synchronous) และอะซิงโครนัส (Asynchronous)
JavaScript คือ ตอนที่ 6 : API ของเบราว์เซอร์และไลบรารี
JavaScript คือ ตอนที่ 7 : โมดูล (Modules), เครื่องมือสร้าง (Build Tools), และ ตัวจัดการแพ็คเกจ (Package Managers)
JavaScript คือ ตอนที่ 8 : แนวทางปฏิบัติที่ดี (Best Practices) และมาตรฐานการเขียนโค้ด