Javascript 101 | มันคืออีกอะไรอ่ะ Java อ่ะป่าว

og:image

JavaScript คืออะไร ??????

JavaScript เป็นภาษาโปรแกรมที่นักพัฒนาใช้ในการสร้างหน้าเว็บ ต่าง ๆ โดยเข้ามาช่วยในเรื่องเชิง เชิงโต้ตอบ กับผู้ใช้งานเว็บ ต่างๆ เอาแบบเห็นภาพง่าย ๆ ก็คือ  ตั้งแต่การรีเฟรชฟีดสื่อโซเชียล การแสดงภาพเคลื่อนไหว แผนที่ การคำนวนเรื่องต่างๆ โดยยังไม่ต้องยื่นยันกับฝั่ง​ server โดย javascript จะรัน อยู่ฝั่ง clinet (front end) ในการมาใช้ประโยชน์ในเรื่องๆ ต่างๆ จึงทำให้ ภาษา javascript มีความนิยมมาถึง ปัจจุบัน

JavaScript ทำงานอย่างไร

ภาษาโปรแกรมทั้งหมดทำงานด้วยการแปลไวยากรณ์ที่คล้ายภาษาอังกฤษเป็นโค้ดสำหรับเครื่อง จากนั้นระบบปฏิบัติการจะเรียกใช้โค้ดนั้น JavaScript ได้รับการจัดประเภทอย่างกว้าง ๆ ว่าเป็นภาษาเขียนสคริปต์ หรือภาษาที่แปลผลแล้ว โค้ด JavaScript ได้รับการแปลผล—นั่นคือ แปลโดยตรงเป็นโค้ดภาษาสำหรับเครื่อง ด้วยกลไกล JavaScript ในขณะที่ในภาษาโปรแกรมอื่น ๆ คอมไพเลอร์จะคอมไพล์โค้ดทั้งหมดเป็นโค้ดสำหรับเครื่องในขั้นตอนที่แยกต่างหาก ดังนั้น ภาษาเขียนสคริปต์ทั้งหมดจึงเป็นภาษาโปรแกรม แต่ไม่ใช่ว่าภาษาโปรแกรมทั้งหมดจะเป็นภาษาเขียนสคริปต์เสมอไป

กลไก JavaScript

กลไก JavaScript คือโปรแกรมคอมพิวเตอร์ที่เรียกใช้โค้ด JavaScript กลไก JavaScript เคยเป็นเพียงตัวแปลผล แต่กลไกสมัยใหม่ทั้งหมดใช้การคอมไพล์แบบ Just-in-time หรือรันไทม์เพื่อปรับปรุงประสิทธิภาพ

JavaScript ฝั่งไคลเอ็นต์

JavaScript ฝั่งไคลเอ็นต์หมายถึงวิธีที่ JavaScript ทำงานในเบราว์เซอร์ของคุณ ในกรณี กลไก JavaScript จะอยู่ภายในโค้ดเบราว์เซอร์ เว็บเบราว์เซอร์เจ้าใหญ่ ๆ ทั้งหมดจะมาพร้อมกับกลไก JavaScript ในตัว

นักพัฒนาแอปพลิเคชันเว็บจะเขียนโค้ด JavaScript ที่มีฟังก์ชันที่แตกต่างกันสัมพันธ์กับเหตุการณ์ต่าง ๆ เช่น การคลิกเมาส์ หรือการเลื่อนเมาส์ผ่าน ฟังก์ชันเหล่านี้จะเปลี่ยนแปลง HTML และ CSS

ต่อไปนี้เป็นภาพรวมว่า JavaScript ฝั่งไคลเอ็นต์ทำงานอย่างไร:

1   เบราว์เซอร์โหลดเว็บเพจเมื่อคุณเยี่ยมชมเว็บเพจ

2   ระหว่างการโหลด เบราว์เซอร์แปลงหน้าและองค์ประกอบทั้งหมดของหน้า เช่น ปุ่ม ป้าย และกล่องดรอปดาวน์ เป็นโครงสร้างข้อมูลที่เรียกว่าโมเดลอ็อบเจกต์เอกสาร (DOM)

3   กลไก JavaScript ของเบราว์เซอร์แปลงโค้ด JavaScript เป็นไบต์โค้ด โค้ดนี้เป็นตัวกลางระหว่างไวยากรณ์ JavaScript และเครื่อง

4   เหตุการณ์ต่าง ๆ เช่น การคลิกเมาส์บนปุ่ม จะกระตุ้นให้บล็อกโค้ด JavaScript ที่เกี่ยวข้องดำเนินการ จากนั้นกลไกจะแปลผลไบต์โค้ด และทำการเปลี่ยนแปลง DOM

5   เบราว์เซอร์แสดงผล DOM ใหม่

amazon

แล้วเราจะเริ่มต้นได้อย่างไรละ ??

จะเริ่มยังไงก่อน

เราสามารถเขียนภาษา javascript ได้ง่ายๆ บน Browser ได้เลยโดยไปเริ่ม

  1. เริ่มจากคลิกขวาที่ Browser
  2. เลือก insepect
  3. คลิกเลือกแท็บ Console
  4. ใส่ console.log(‘Hello word ‘) และ Enter
  5. รอดูผลลัพท์

แต่ javascript มันก็ยังสามารถรันฝั่ง server ได้ โดยเราจะต้อง ลง โปรแกรมเพิ่มเติม คือ node js

สามารถโหลดโปรแกรมได้ที่ นี้ คลิก และก็ลงตามระบบปฏิบัติการได้เลยครับเมื่อลงเสร็จเราจะมาทำการเริ่มต้นเขียนได้อย่างไรโดยสามารถเริ่มตัวได้

เริ่มต้น Node.js

พิมพ์คำสั่ง node บน Terminalสามารถที่จะรันคำสั่ง JavaScript บน Terminal ได้เลย

$ node
> console.log('Hello Node.js');
Hello Node.js
undefined
> function sayHi() { return "Hi!"; }
undefined
> sayHi();
'Hi!'
> 10 + 10
20
>

หรือทดสอบโดยการสร้างไฟล์ JavaScript ขึ้นมาไฟล์นึง เช่น test.js จากนั้น ใส่โค๊ดด้านล่างลงไป

console.log('Hello Node.js');
function sayHi() {
  return 'Hi!';
}

console.log(sayHi());

คำสั่งที่ใช้ให้ Node รันไฟล์ JavaScript คือ node FILENAME เช่น

node test.js

จะได้ผลลัพธ์ดังนี้

Hello Node.js
Hi!

แค่นี้เราสามารถเริ่มต้น javascript ได้แล้ว สามารถ อ่านเพิ่มเติมได้ ที่ นี้เลย

ขอบคุณหลายๆ ที่มากๆ ครับ เดียวครั้งหน้าเราจะมาพูดคุยเริ่มอะไรอีกติดตามได้เลยครับ ขอบคุณครับ