JavaScript คืออะไร? คุณสมบัติ, Use Case & More

เผยแพร่แล้ว: 2022-08-03

ภาษาสคริปต์ที่ใช้กันส่วนใหญ่บนเว็บเรียกว่า JavaScript (JS) มันถูกรวมเข้ากับโค้ด HTML บ่อยครั้ง และใช้เพื่อปรับปรุงหน้า HTML ภาษาที่มีคำอธิบายประกอบคือ JavaScript จึงไม่ต้องประกอบ JavaScript สร้างเนื้อหาเว็บไซต์อย่างสนุกสนานและโต้ตอบได้ ภายในปี 2022 เว็บไซต์ส่วนใหญ่จะใช้ JavaScript ที่ฝั่งผู้ใช้เพื่อควบคุมลักษณะการทำงานของหน้าเว็บ ซึ่งมักใช้ไลบรารีของบุคคลที่สาม เอ็นจิ้น JavaScript แบบพิเศษมีอยู่ในเว็บเบราว์เซอร์หลักๆ ทุกเว็บ มันถูกใช้เพื่อรันซอฟต์แวร์บนอุปกรณ์ของผู้ใช้

สารบัญ

JavaScript คืออะไร?

JavaScript จะเป็นลำดับคำสั่งระดับสูงที่สอดคล้องกับ ECMAScript และมักจะทันเวลา มันมีการดำเนินการชั้นหนึ่ง ความสามารถทางกายภาพตามต้นแบบ และการเน้นไวยากรณ์ สนับสนุนภาษาที่ขับเคลื่อนด้วยเหตุการณ์ ปฏิกิริยา และภาษาโปรแกรม และเป็นหลายกระบวนทัศน์ มีแอพพลิเคชั่นซอฟต์แวร์ (API) สำหรับการใช้ Document Object Model ภาษาคิวรี วันที่ และโครงสร้างข้อมูลทั่วไป (DOM)

ไม่มีคุณสมบัติอินพุต/เอาต์พุต (I/O) เช่น การสื่อสาร ที่เก็บข้อมูล หรือความสามารถด้านภาพในข้อกำหนด ECMAScript ในความเป็นจริง JavaScript I/O API นั้นนำเสนอโดยอินเทอร์เน็ตเบราว์เซอร์หรือระบบรันไทม์อื่น แต่เดิมพบเฉพาะในอินเทอร์เน็ตเบราว์เซอร์ โปรเซสเซอร์ JavaScript ได้กลายเป็นส่วนสำคัญของบางเว็บไซต์และแอพพลิเคชั่นที่หลากหลาย Node.js เป็นแพลตฟอร์มรันไทม์ที่ใช้กันอย่างแพร่หลายมากที่สุดสำหรับแอปพลิเคชันนี้ แม้ว่าจะมีชื่อ ไวยากรณ์ และไลบรารีมาตรฐานที่สอดคล้องกันสำหรับ Java และ JavaScript แต่ภาษาต่างๆ ก็มีเอกลักษณ์เฉพาะตัวและมีการออกแบบที่แตกต่างกันมาก

การกำหนด JavaScript ในระดับที่ลึกกว่า

บางครั้ง หน้าผู้ใช้ทำมากกว่าการนั่งเฉยๆ และแสดงรายละเอียดที่จำเป็นเพื่อให้คุณดูได้ เช่น การนำเสนอเนื้อหาที่ทันเวลา เนื้อหาที่ดีขึ้น แผนที่แบบละเอียด กราฟิก 2D/3D แบบโต้ตอบ กล่องดนตรีมัลติมีเดียแบบเลื่อน ฯลฯ คุณทำได้ แน่นอนเดิมพันว่า JavaScript อาจเกี่ยวข้อง JavaScript จะเป็นสคริปต์หรือแพลตฟอร์มการเข้ารหัสที่อนุญาตให้ผู้ใช้บังคับใช้โครงสร้างขั้นสูงบนหน้าเว็บ มันจะเป็นชั้นที่สามของเค้กที่ประกอบด้วยเทคโนโลยีเว็บทั่วไป สองอันดับแรก (HTML และ CSS)

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

การใช้ CSS ซึ่งเป็นคำศัพท์เกี่ยวกับกฎเกณฑ์และแนวทางปฏิบัติ เราสามารถจัดรูปแบบข้อความ HTML ได้หลายวิธี เช่น เลือกสีพื้นฐานและฟอนต์ และจัดระเบียบเป็นคอลัมน์จำนวนมาก ภาษาการเขียนโปรแกรมระดับสูงช่วยให้คุณทำทุกสิ่งได้ รวมถึงการอัพเดตเนื้อหาแบบไดนามิก การจัดการมัลติมีเดีย และกราฟิกแอนิเมชั่น โอเค อาจไม่ใช่บางสิ่ง แต่มันน่าประหลาดใจที่คำสองสามคำของตัวสร้างโค้ดสามารถทำได้

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

ฝั่งไคลเอ็นต์ รูปแบบที่ได้รับความนิยมมากที่สุดของโครงสร้างทางไวยากรณ์คือ JavaScript เพื่อให้เบราว์เซอร์รู้จักโค้ดของสคริปต์ โค้ดนั้นต้องรวมอยู่ในหรือเชื่อมโยงจากเอกสาร HTML

หมายความว่าเว็บไซต์ใหม่ไม่จำเป็นต้องเป็น HTML แบบคงที่ แต่อาจมีโปรแกรมที่สื่อสารกับผู้ใช้ จัดการเบราว์เซอร์ และสร้างเอกสาร Html ได้ทุกที่

เหนือโปรแกรมฝั่งเซิร์ฟเวอร์ CGI ทั่วไป วิธีฝั่งไคลเอ็นต์ JavaScript มีประโยชน์หลายประการ ตัวอย่างเช่น อาจใช้ JavaScript เพื่อกำหนดว่าผู้ใช้ได้ระบุที่อยู่อีเมลใหม่ในช่องป้อนข้อมูลหรือไม่

เมื่อลูกค้าส่งแบบฟอร์ม JavaScript จะทำงาน และหากรายการทั้งหมดถูกต้องจึงจะถูกส่งไปยังเซิร์ฟเวอร์ระยะไกล จาวาสคริปต์อาจถูกใช้เพื่อสกัดกั้นกิจกรรมของผู้ใช้ที่เริ่มต้นโดยเจตนาหรือโดยปริยาย เช่น ปุ่มกด การเคลื่อนไหวไฮเปอร์ลิงก์ และกิจกรรมอื่นๆ

Javascript ใช้สำหรับอะไร?

1. การพัฒนาเว็บ

หน้าเว็บถูกสร้างขึ้นโดยใช้ภาษาโปรแกรมไคลเอ็นต์ที่เรียกว่า JavaScript Netscape สร้างเป็นโปรแกรมแบบสแตนด์อโลน ใช้เพื่อมอบความสามารถเฉพาะให้กับหน้าต่างๆ เช่น การหมุน การเปิดตัว และรูปแบบภาพต่างๆ เมื่อเว็บไซต์ต้องได้รับการแสดงแบบไดนามิก เว็บไซต์ทั้งหมดใช้เพื่อวัตถุประสงค์ในการตรวจสอบเป็นหลัก เปิดใช้งานโปรแกรมภายนอก เช่น เอกสาร Word ปุ่มที่เรียกใช้ รองรับแอป Flash ฯลฯ เกี่ยวกับการตรวจสอบ เมื่อผู้ใช้ร้องขอ ก็อาจโหลดเนื้อหาลงในหน้าโดยไม่ต้องรีเฟรช

2. เว็บแอปพลิเคชัน

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

3. การนำเสนอ

JavaScript เสนอความสามารถในการสร้างงานนำเสนอเป็นเว็บไซต์เช่นกัน ในการสร้างการนำเสนอสไลด์บนเว็บ JavaScript เสนอแพ็คเกจ RevealJS และสั่งทำพิเศษ Reveal.js ใช้ HTML เพื่อสร้างงานนำเสนอที่น่าทึ่งและน่าสนใจที่สุดมากมาย สไลด์ที่ซ้อนกันนั้นง่ายต่อการวางสำหรับผู้ใช้ ด้วยความช่วยเหลือออนไลน์มากมาย ทุกคนสามารถออกแบบเว็บไซต์ได้โดยไม่ต้องมีประสบการณ์ในการเขียนโปรแกรม สไลด์โชว์เหล่านี้ได้รับการปรับให้เหมาะกับการสัมผัสและทำงานได้ดีบนแท็บเล็ต สมาร์ทโฟน และอุปกรณ์พกพาอื่นๆ

นอกจากนี้ JavaScript ยังมีฉากหลังสไลด์ รูปแบบการเปลี่ยน และสไตล์อีกด้วย รองรับรูปแบบสี CSS ทั้งหมด นอกจากนี้ JavaScript ยังมีปลั๊กอิน Bespoke.js ที่มีฟังก์ชันการทำงานมากมาย ซึ่งประกอบด้วยรายการหัวข้อย่อยแบบไดนามิก การปรับขนาดแบบตอบสนอง และการขีดเส้นใต้ไวยากรณ์สำหรับตัวอย่างโค้ด นำเสนอธีมที่มีรสนิยมและเรียบง่าย การใช้เครื่องกำเนิดไฟฟ้าเพื่อเปิดใช้ Bespoke.js เป็นตัวเลือกที่เร็วที่สุด ผู้ใช้สามารถเพิ่มชื่อเรื่องในการนำเสนอและตอบคำถามหลายข้อเพื่อรับปลั๊กอินที่จำเป็น

4. แอปพลิเคชันเซิร์ฟเวอร์

ด้วยความช่วยเหลือของเซิร์ฟเวอร์ Node JS ใช้แอปพลิเคชันที่ขับเคลื่อนด้วยเหตุการณ์ ขนาดเล็ก และมีประสิทธิภาพซึ่งกระจายไปทั่วระบบ ฟังก์ชันนี้อาจเขียนด้วย JavaScript บนไคลเอ็นต์ในขณะที่ผู้ใช้กำลังสร้างแอปฝั่งไคลเอ็นต์ที่ซับซ้อนใน JavaScript เพื่อให้การแปลทางจิตใจระหว่างสองภาษาเป็นไปได้

5. เว็บเซิร์ฟเวอร์

เว็บเซิร์ฟเวอร์สามารถสร้างขึ้นโดยใช้ Node JS Node JS มีประโยชน์ในการขับเคลื่อนด้วยเหตุการณ์และไม่ต้องรอผลลัพธ์ของการเรียกครั้งก่อน โดยจะสลับไปยังการโทรครั้งถัดไปในขณะที่ใช้เหตุการณ์เพื่อรับการแจ้งเตือนเมื่อได้รับข้อมูลบางส่วนสำหรับการโทรก่อนหน้า เซิร์ฟเวอร์ที่ใช้ Node JS มีความรวดเร็วมาก ไม่ต้องการบัฟเฟอร์ และส่งข้อมูลเป็นกลุ่ม

นอกจากนี้ ยังใช้การวนรอบเหตุการณ์ที่เป็นเธรดเดียวและไม่มีการบล็อก ฟังก์ชัน createServer() ของแพ็คเกจ HTTP สามารถใช้เพื่อช่วยในการสร้างเซิร์ฟเวอร์ ทุกครั้งที่มีผู้ตรวจสอบพอร์ต 8080 อย่างต่อเนื่อง โพรซีเดอร์นี้จะถูกเรียกใช้ ในทางกลับกัน เซิร์ฟเวอร์ HTTP จำเป็นต้องส่งออก HTML และเพิ่มลงในคำขอ HTTP สามารถติดตั้งได้อย่างรวดเร็วโดยป้อน "npm install -g HTTP-server" และสามารถเปิดใช้ได้โดยใช้การดำเนินการ "HTTP-server"

6. เกมส์

นอกจากหน้าเว็บแล้ว ยังสร้างเกมโดยใช้ JavaScript ได้อีกด้วย ความนิยมของ JavaScript ในการพัฒนาเกมเกิดจากการรวมเข้ากับ HTML5 มีไลบรารี Ease JS ซึ่งมีวิธีการที่ตรงไปตรงมาสำหรับการโต้ตอบกับรูปภาพที่หลากหลาย นอกจากนี้ยังมี API ที่มีรายการการนำเสนอที่มีโครงสร้างซึ่งนักพัฒนาซอฟต์แวร์ Flash ทุกคนรู้จัก สเตจที่ผู้ใช้สร้างจะส่งรายการการนำเสนอไปยังพื้นที่ทำงานที่ต้องการ นอกจากนี้ Ease JS ยังมีบิตแมป 2D ที่เรียกว่า Sprite ที่แสดงผลทันทีเพื่อสร้างปลายทางสำหรับการแก้ไข

7. ศิลปะ

ตอนนี้สร้างภาพบนเว็บไซต์โดยใช้ HTML5 และ JavaScript ได้ง่ายขึ้น ความสามารถในการสร้างรูปทรงสองหรือหลายรูปร่างบนผืนผ้าใบทำให้เบราว์เซอร์เป็นแพลตฟอร์มใหม่ทั้งหมดสำหรับงานศิลปะดิจิทัลทุกประเภท เนื่องจากผืนผ้าใบไม่มีขอบเขตและไม่มีสาระ ใครๆ ก็สามารถใช้ผืนผ้าใบนั้นเพื่อสร้างงานศิลปะได้

8. แอปพลิเคชั่นสมาร์ทวอทช์

จาวาสคริปต์เป็นภาษาที่ใช้กันอย่างแพร่หลายมากที่สุดเพราะสามารถใช้กับอุปกรณ์หรือแอปพลิเคชันใดก็ได้ แอปพลิเคชันสำหรับนาฬิกาอัจฉริยะใช้แอปพลิเคชันชื่อ Pebble JS ซึ่งให้บริการโดย JavaScript Uses สำหรับแอพที่ต้องใช้อินเทอร์เน็ตในการทำงาน เฟรมเวิร์กนี้มีประสิทธิภาพ นักพัฒนาสามารถใช้ Pebbles เพื่อสร้างแอปพลิเคชัน JavaScript สำหรับนาฬิกาต่างๆ

9. แอปพลิเคชั่นสำหรับมือถือ

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

เฟรมเวิร์กที่ทำให้สิ่งนี้เป็นไปได้คือ PhoneGap React Native ซึ่งเพิ่งพัฒนาขึ้น มีฟังก์ชันนี้ เป็นผู้สนับสนุนหลักในการอัปเดตและเปิดตัวข้ามแพลตฟอร์ม จาวาสคริปต์จึงอาจใช้เพื่อรับและปรับใช้โปรแกรมที่เหมาะสมในบริบทต่างๆ


Javascript ขั้นสูง: กรอบงานและไลบรารี (เครื่องมือ AKA เพื่อทำให้ JS ง่ายขึ้น)

เมื่อทำงานกับ JavaScript คุณจะพบว่าฟีเจอร์และฟังก์ชันบางอย่างของ JS เช่น การเปลี่ยนเมนูและการเฟดเอาต์ แบบฟอร์มการถ่ายโอนไฟล์ และแกลเลอรีรูปภาพ มักปรากฏบนเว็บไซต์และแอปพลิเคชันออนไลน์หลายแห่ง แม้ว่าคุณจะสามารถสร้างไอเท็มเหล่านี้ได้ทุกเมื่อที่คุณต้องการ แต่การใช้เฟรมเวิร์กการเขียนโค้ดอย่าง jQuery จะทำให้ชีวิตของคุณในฐานะโปรแกรมเมอร์ง่ายขึ้นมาก

jQuery

jQuery

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

 <script> $(“#submit”).click(function () { var greeting = $(“#name”).val(); $("#headline").html("Thank you for joining our email list," + greeting); return false; }); <script/>

อย่างที่คุณเห็นแล้ว รูปแบบการเข้ารหัส jQuery นั้นกระชับกว่ามาก สามารถใช้งานได้ทุกเมื่อที่คุณต้องการเขียนโค้ดเว็บไซต์และแอปพลิเคชันออนไลน์ และต้องใช้ฟังก์ชัน JavaScript เดียวกัน

โค้ด JQuery อาจรวมกันเพื่อสร้างปลั๊กอินที่ซับซ้อนมากขึ้น นอกเหนือจากอินสแตนซ์ดังที่กล่าวมาแล้ว ซึ่งเรียกว่า jQuery excerpts ของโค้ดที่ฉีดตรงจาก jQuery framework เพื่อดำเนินการตามวัตถุประสงค์บางอย่าง การเข้าถึงโดยตรงไปยังปลั๊กอิน jQuery สามารถทำได้ผ่านไลบรารี jQuery Graphics (ส่วนต่อประสานผู้ใช้) ซึ่งข้อมูลดั้งเดิมอาจถูกคัดลอกและวาง

ReactJS

ปฏิกิริยา

ReactJS จะเป็นอีกหนึ่งเฟรมเวิร์ก Javascript ที่จำเป็นสำหรับนักพัฒนาเว็บ รวมถึง jQuery Facebook สร้าง React JS ในปี 2011 เป็นชุดเครื่องมือ JavaScript ด้านหน้าที่เน้นการพัฒนา UI (ส่วนต่อประสานผู้ใช้) หากคุณไม่คุ้นเคย อินเทอร์เฟซผู้ใช้ (UI) คือแผงควบคุมบนหน้าจอ แถบค้นหา ไอคอน และอื่นๆ ที่ผู้ใช้มีส่วนร่วมเพื่อใช้แอปพลิเคชันของบุคคลที่สาม

React ปรับปรุงประสิทธิภาพโดยรวมของไซต์และความน่าเชื่อถือด้วยแนวคิดที่เรียกว่า Virtual DOM และช่วยให้นักพัฒนาสามารถใช้ประโยชน์จากโค้ดที่เขียนไว้ล่วงหน้าสำหรับองค์ประกอบเมนูที่ทำซ้ำ ซึ่งรวมถึงคุณลักษณะต่างๆ เช่น ออกแบบมาเพื่อประเมิน ความสามารถในการปรับแต่งส่วนบุคคล การเปลี่ยนแบบเฟดอินหรือเอาต์ออก เป็นต้น


คุณสมบัติของ JavaScript

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

คุณสมบัติจาวาสคริปต์ทั่วไป

ภาษา JavaScript มีรายการฟังก์ชัน ต่อไปนี้เป็นคุณสมบัติทั่วไปของ JavaScript:

1. การตรวจสอบการป้อนข้อมูลของผู้ใช้

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

2. การคำนวณอย่างง่ายในฝั่งไคลเอ็นต์

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

3. อำนาจมากขึ้น

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

4. ไม่ติดแพลตฟอร์ม

เนื่องจากเบราว์เซอร์ตีความ JavaScript จึงช่วยขจัดปัญหาด้านการทำงานร่วมกันและการพัฒนา ดังนั้นจึงสามารถใช้บนแพลตฟอร์มที่รองรับ Netscape รวมถึง Windows, Macintosh และอื่นๆ นอกจากนี้ยังอาจรวมอยู่ในสคริปต์อื่นๆ ที่ใช้ JavaScript เช่น HTML

5. การจัดการวันที่และเวลา

JavaScript ตรงกันข้ามกับภาษาสคริปต์อื่น ๆ ที่มาพร้อมกับวิธีการคำนวณตำแหน่ง/สถานที่ ด้วยเหตุนี้ การเขียนโค้ดโดยใช้เทคนิคเหล่านี้จึงเป็นเรื่องง่ายอย่างเหลือเชื่อ getDate().

6. การผลิตเนื้อหา HTML

JavaScript นำเสนอคุณสมบัติที่มีประโยชน์อย่างยิ่งหลายอย่างสำหรับการสร้างเนื้อหาออนไลน์โดยทางโปรแกรม หลังจากเหตุการณ์ เราสามารถเพิ่มเนื้อหา ลิงก์ รูปภาพ ตาราง ฯลฯ

7. การกำหนดระบบปฏิบัติการและเบราว์เซอร์ของผู้ใช้

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

คุณสมบัติจาวาสคริปต์สมัยใหม่

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

1. ให้/const

ตัวระบุ "let" และ "const" ซึ่งพร้อมที่จะแทนที่ "var" ถูกเพิ่มโดย JavaScript ต่างจาก “var” ตรงที่ เราสามารถใช้ได้เฉพาะภายในบล็อกที่กำหนดไว้ ทำให้มีความสำคัญมากกว่า "var" ซึ่งอาจเข้าถึงได้นอกเหนือจากโปรแกรมแม้หลังจากเริ่มต้น

2. ฟังก์ชั่นลูกศร

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

3. เทมเพลตตามตัวอักษร

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

4. ฟังก์ชั่นอาร์เรย์ใหม่

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

5. การตั้งค่าเริ่มต้น

ฟีเจอร์ JavaScript นี้ช่วยป้องกันไม่ให้โค้ดทั้งหมดเสียหายจากการพิมพ์ผิดเพียงครั้งเดียว เมื่อโปรแกรมเมอร์ต้องตรวจสอบว่าฟังก์ชันทำงานโดยไม่มีข้อโต้แย้ง จะมีประโยชน์มาก

6. ชวเลขทรัพย์สิน

การใช้เทคนิคในตัวเช่น get() เปิดให้โปรแกรมเมอร์ เทคนิคเหล่านี้ช่วยลดจำนวนบรรทัดของโค้ดที่เขียนขึ้น และป้องกันการนำโค้ดเดิมไปใช้ซ้ำๆ กลไกโดยกำเนิดเหล่านี้มีประโยชน์มากในการลดเวลาและค่าใช้จ่ายในการพัฒนา


แล้วมันทำอะไรได้บ้าง?

โครงสร้างการเขียนโปรแกรมพื้นฐานของภาษา JavaScript ฝั่งไคลเอ็นต์ช่วยให้คุณดำเนินการต่างๆ เช่น:

ใส่ข้อมูลที่เป็นประโยชน์ในตัวแปร และอีกมากมาย!

อย่างไรก็ตาม ความสามารถตามภาษาการเขียนโปรแกรมฝั่งไคลเอ็นต์นั้นน่าสนใจกว่ามาก เพื่อใช้ในโค้ด JavaScript ที่เรียกว่า Open Source Interfaces (APIs) ให้คุณเข้าถึงพลังพิเศษเพิ่มเติม

API คือคอลเล็กชันของส่วนประกอบการเข้ารหัสที่สร้างไว้ล่วงหน้าซึ่งช่วยให้นักพัฒนาสามารถสร้างแอปพลิเคชันที่อาจสร้างความท้าทายหรือสร้างไม่ได้ พวกเขาทำงานคล้ายกับชุดเฟอร์นิเจอร์สำเร็จรูปในการก่อสร้างบ้านในแง่ของการเข้ารหัส

1. API ของเบราว์เซอร์

เว็บเบราว์เซอร์ของคุณมี API ในตัวที่อาจทำงานที่ซับซ้อนที่เป็นประโยชน์หรือเปิดเผยข้อมูลจากระบบคอมพิวเตอร์พื้นฐาน

2. API บุคคลที่สาม

โดยส่วนใหญ่ คุณต้องรับรหัสและข้อมูลเมตาสำหรับ API ของบริษัทอื่นจากอินเทอร์เน็ต เนื่องจากไม่รวมอยู่ในเบราว์เซอร์โดยค่าเริ่มต้น

3. JavaScript สามารถเปลี่ยนเนื้อหา HTML ได้

getElementById เป็นหนึ่งในเมธอด JavaScript HTML จำนวนมาก ()

ตัวอย่างนี้แปลง innerHTML ขององค์ประกอบเป็น "Hello JavaScript" โดยใช้เทคนิคเพื่อ "ระบุตำแหน่ง" โค้ด Html ด้วยแอตทริบิวต์ id= "demo":

ตัวอย่าง

 document.getElementById("demo").innerHTML = "Hello JavaScript";

4. JavaScript สามารถเปลี่ยนค่าแอตทริบิวต์ HTML ได้

ค่าแอตทริบิวต์ HTML สามารถแก้ไขได้โดยใช้ JavaScript ตัวอย่างเช่น JavaScript แก้ไขค่าของคุณสมบัติ src (แหล่งที่มา) ของรูปภาพ

5. JavaScript สามารถเปลี่ยนรูปแบบ HTML (CSS)

รูปแบบของการแก้ไขคุณสมบัติ HTML คือการปรับเปลี่ยนลักษณะที่ปรากฏขององค์ประกอบ HTML:

ตัวอย่าง

 document.getElementById("demo").style.font size = "35px";

หรือ

 document.getElementById('demo').style.font size = '35px';

document.getElementById('demo').style.font size = '35px';

6. JavaScript สามารถซ่อนองค์ประกอบ HTML

สามารถเปลี่ยนรูปแบบหน้าจอเพื่อซ่อนองค์ประกอบ HTML ได้:

ตัวอย่าง

 document.getElementById("demo").style.display = "none";

หรือ

 document.getElementById('demo').style.display = 'none';

7. JavaScript สามารถแสดงองค์ประกอบ HTML

การเปลี่ยนรูปแบบการแสดงผลเป็นอีกวิธีหนึ่งในการทำให้องค์ประกอบ HTML ที่ซ่อนอยู่มองเห็นได้:

ตัวอย่าง

 document.getElementById("demo").style.display = "block";

หรือ

 document.getElementById('demo').style.display = 'block';

เปลี่ยนไอเดียแอพของคุณให้เป็นจริง

มาสร้างแอปใหม่ด้วยกัน

เริ่ม

ประเภทข้อมูล JavaScript

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

1. ค่านิยมดั้งเดิม

ทุกชนิดกำหนดค่าที่ไม่เปลี่ยนรูป (เช่น ไม่เปลี่ยนแปลง) ยกเว้นวัตถุ สตริงเช่นจะไม่เปลี่ยนรูป ค่าประเภทนี้เรียกว่า "ค่าดั้งเดิม"

2. ประเภทบูลีน

นิพจน์บูลีนอธิบายเอนทิตีเชิงตรรกะและมีสองผลลัพธ์ที่เป็นไปได้: จริงและเท็จ

3. ประเภทว่าง

ชนิดข้อมูลที่ไม่ซ้ำอีกประเภทหนึ่งคือชนิดนี้ที่มีค่าว่างเท่านั้นเป็นค่าที่เป็นไปได้ ค่า Null แสดงว่าไม่มีค่า ไม่เหมือนกับสตริงว่าง (“”) หรือ 0; มันไม่มีอะไร เนื้อหาปัจจุบันสามารถลบออกได้อย่างชัดเจนโดยให้ตัวแปรเป็นค่า null

4. ไม่ได้กำหนดประเภท

undefined ค่าเฉพาะคือค่าที่เป็นไปได้เพียงอย่างเดียวสำหรับประเภทข้อมูลที่ไม่ได้กำหนด ความหมายของตัวแปรนั้นไม่แน่นอนหากมีการกำหนดไว้แต่ไม่ได้กำหนดค่าไว้

5. ประเภทตัวเลข

จำนวนเต็มที่แสดงในรูปแบบลอการิทึม เช่น ค่าต่อไปนี้หรือค่าบวกหรือค่าลบที่มีหรือไม่มีค่าตัวเลข จะแสดงด้วยชนิดข้อมูลจำนวนเต็ม เช่น 1.5e-4

6. ประเภท BigInt

ใน JavaScript ประเภท BigInt จะเป็นตัวเลขพื้นฐานที่อาจแสดงตัวเลขที่มีระดับความแม่นยำเท่าใดก็ได้ แม้หลังจากขีดจำกัดจำนวนเต็มที่ปลอดภัยสำหรับ Numbers แล้ว คุณยังสามารถจัดเก็บและทำงานกับตัวเลขจำนวนมากได้อย่างปลอดภัยโดยใช้ BigInts

7. ประเภทสตริง

ข้อมูลข้อความสามารถแสดงด้วยประเภทข้อมูลสตริง (เช่น ลำดับของอักขระ) สตริงถูกสร้างขึ้นโดยการใส่อักขระตั้งแต่หนึ่งตัวขึ้นไปในเครื่องหมายคำพูดเดี่ยวหรือสองครั้ง

8. ประเภทสัญลักษณ์

สามารถใช้ Symbol เป็นคีย์ของแอตทริบิวต์ Object ได้ เนื่องจากเป็นค่าดั้งเดิมที่ชัดเจนและไม่เปลี่ยนแปลง (ดูด้านล่าง) สัญลักษณ์เรียกว่า "อะตอม" ในภาษาคอมพิวเตอร์บางภาษา

9. วัตถุ (คอลเลกชันของคุณสมบัติ)

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


เครื่องมือและทรัพยากร

1. เครื่องมือสำหรับนักพัฒนา Firefox

Firefox มาพร้อมกับชุดเครื่องมือสำหรับนักพัฒนาเว็บที่เรียกว่า Firefox Developer Tools อาจใช้เพื่อตรวจสอบ แก้ไข และดีบัก JavaScript, CSS และ HTML โดยการเลือก เครื่องมือ > นักพัฒนาเว็บ > เครื่องมือสำหรับนักพัฒนาเว็บ จากเมนู คุณจะสามารถเข้าถึงเครื่องมือสำหรับนักพัฒนาของ Firefox ได้

2. เว็บคอนโซล

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

3. JavaScript Profiler

เครื่องมือสำคัญสำหรับการทำความเข้าใจโค้ดของคุณให้ดีขึ้นคือตัวสร้างโปรไฟล์ JS ซึ่งสามารถระบุตำแหน่ง ระบุ และเพิ่มประสิทธิภาพความไร้ประสิทธิภาพในโค้ดของคุณได้ เนื่องจากคุณเคยชินกับ UI มันจึงใช้งานง่าย และมีโอกาสที่คุณจะติดตั้งไว้ในเบราว์เซอร์ของคุณแล้ว

4. ดีบักเกอร์

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

5. JavaScript Shells

คุณสามารถทดสอบส่วนย่อยของโค้ด JavaScript ได้อย่างง่ายดายโดยใช้เชลล์ JavaScript โดยไม่ต้องรีเฟรชเว็บไซต์ มีประโยชน์มากในการเขียนและแก้ไขโค้ด

6. เรียนรู้จาวาสคริปต์

เรียนรู้พื้นฐานของ JavaScript ร่วมสมัย (ES2015+) จากนั้นฝึกฝนในสภาพแวดล้อมที่เป็นธรรมชาติ เพื่อให้แน่ใจว่าคุณกำลังค่อยๆ เรียนรู้มาตรฐานอุตสาหกรรม ความท้าทายจะขึ้นอยู่กับโครงการจริง

7. ร่วมกันJS

ไลบรารี Mozilla TogetherJS JavaScript ให้ความสามารถและฟังก์ชันการทำงานร่วมกันแก่เว็บไซต์ของคุณได้ฟรี ผู้ใช้ของคุณสามารถช่วยเหลือซึ่งกันและกันบนเว็บไซต์ของคุณได้ทันทีโดยเพิ่ม TogetherJS เข้าไป!

8. StackOverflow

โปรแกรมเมอร์อาจถามคำถามและค้นหาคำตอบบนเว็บไซต์ Stack Overflow ทำหน้าที่เป็นเว็บไซต์เรือธงของ Stack Exchange Network Joel Spolsky และ Jeff Atwood พัฒนามันในปี 2008 โดยให้คำตอบสำหรับคำถามในหัวข้อที่เกี่ยวข้องกับการเขียนโปรแกรมคอมพิวเตอร์ต่างๆ

9. JSFiddle

สำหรับการวิเคราะห์และแสดงตัวอย่างโค้ด HTML, CSS และ JavaScript ที่ผู้ใช้สร้างขึ้นและทำงานร่วมกัน ซึ่งบางครั้งเรียกว่า "fiddles" JSFiddle คือบริการและชุมชน IDE ดิจิทัล คุณสามารถเลียนแบบการโทร AJAX ได้โดยใช้

10. เจเอสบี

แอปพลิเคชันออนไลน์ที่เรียกว่า JS Bin ถูกสร้างขึ้นเพื่อช่วยนักพัฒนา JavaScript และ CSS เป็นหลักในการทดสอบและดีบักโค้ดแฟรกเมนต์ในบริบท คุณสามารถทดสอบและแก้ไข HTML และ JavaScript ด้วย JS Bin

11. โค้ดเพน

สำหรับมืออาชีพด้านการออกแบบส่วนหน้า มีสภาพแวดล้อมการพัฒนาส่วนกลางที่เรียกว่า CodePen สร้างและเผยแพร่เว็บไซต์ แสดงความสำเร็จของคุณ สร้างกรณีทดสอบสำหรับการเรียนรู้และแก้ไขจุดบกพร่อง และรับแรงบันดาลใจ

12. StackBlitz

ด้วยความช่วยเหลือของ IDE (ดีบักเกอร์) StackBlitz ออนไลน์ คุณสามารถสร้างแอปพลิเคชัน Angular, React และ Vue ในเบราว์เซอร์ของคุณได้อย่างง่ายดายและบ่อยครั้ง การติดตั้งการขึ้นต่อกัน การคอมไพล์ การแพ็ก การอัพเดตแบบด่วนเมื่อคุณป้อน และอื่นๆ อีกมากมายจะได้รับการจัดการโดยอัตโนมัติ

13. RunJS

การรันช่วยให้คุณเข้าถึง DOM และเข้าถึง Node และ Browser API ได้อย่างสมบูรณ์ ซึ่งทำให้คุณสามารถปรับเปลี่ยนได้ในระดับหนึ่งซึ่งเป็นไปไม่ได้กับคอนโซล Chrome หรือ REPL ปกติ

14. Microsoft FrontPage

Microsoft ได้สร้าง FrontPage ซึ่งเป็นโปรแกรมแก้ไข HTML ที่ได้รับความนิยม นักออกแบบเว็บไซต์อาจสร้างเว็บไซต์แบบไดนามิกด้วยความช่วยเหลือของความสามารถของ JavaScript ที่ FrontPage นำเสนอ

15. Macromedia Dreamweaver MX

Macromedia Dreamweaver MX เป็นเครื่องมือ HTML และ JavaScript ที่ได้รับความนิยมอย่างสูงในหมู่ผู้เชี่ยวชาญด้านการพัฒนาเว็บ มันมีองค์ประกอบ JavaScript ที่สร้างไว้ล่วงหน้าที่มีประโยชน์หลายอย่าง ทำงานได้ดีกับฐานข้อมูล และสอดคล้องกับมาตรฐานที่เกิดขึ้นใหม่ เช่น XHTML และ XML

16. Macromedia โฮมไซต์ 5

นักพัฒนา HTML และ JavaScript ยอดนิยมจาก Macromedia ชื่อ HomeSite 5 อาจถูกใช้เพื่อดูแลหน้าเว็บส่วนตัวอย่างมีประสิทธิภาพ


คุณเพิ่ม JavaScript ในหน้าของคุณอย่างไร?

JavaScript ก็เหมือนกับการปรับใช้ CSS กับหน้า HTML ของคุณ ในขณะที่ CSS ใช้องค์ประกอบ <link> เพื่อใช้สไตล์ชีตภายนอกและองค์ประกอบ <style> เพื่อใช้สไตล์ชีตภายในกับ HTML แต่ JavaScript ต้องการเพื่อนเพียงคนเดียวในโลกของ HTML - องค์ประกอบ <script> มาดูกันว่ามันทำงานอย่างไร

JavaScript ภายใน

1. ทำสำเนาไฟล์ในเครื่องที่ใช้-javascript.html จากตัวอย่างของเราก่อน กรุณาวางไว้ในตำแหน่งตรรกะและไดเรกทอรี

2. เปิดไฟล์ทั้งในโปรแกรมแก้ไขข้อความและเว็บเบราว์เซอร์ คุณจะเห็นว่า HTML สร้างหน้าเว็บที่ตรงไปตรงมาด้วยปุ่มที่คลิกได้

3. จากนั้น เปิดโปรแกรมแก้ไขข้อความและใส่สิ่งต่อไปนี้ก่อนแท็กปิด </head> ทางจิตใจ:

 <script> // JavaScript goes here </script>

4. เพื่อให้หน้าเว็บมีการดำเนินการที่น่าสนใจมากขึ้น ตอนนี้เราจะรวม JavaScript บางส่วนไว้ในองค์ประกอบ <script> ของเรา

5. เมื่อคุณกดลิงก์ ย่อหน้าใหม่จะปรากฏขึ้นด้านล่างเมื่อคุณบันทึกเอกสารและรีเฟรชเบราว์เซอร์

JavaScript ภายนอก

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

2. ขั้นแรก สร้างโฟลเดอร์ใหม่ในโฟลเดอร์เดียวกับไฟล์ HTML ตัวอย่างของคุณ เรียกมันว่า script.js และตรวจสอบให้แน่ใจว่าชื่อไฟล์ลงท้ายด้วย in.js เพื่อให้สามารถระบุ JavaScript ได้

3. แทนที่องค์ประกอบ <script> ปัจจุบันของคุณด้วยสิ่งต่อไปนี้:

 <script src="script.js" defer></script>

4. ภายใน script.js เพิ่มสคริปต์ต่อไปนี้:

 function createParagraph() { const para = document.createElement('p'); para.textContent = 'You clicked the button!'; document.body.appendChild(para); } const buttons = document.querySelectorAll('button'); for (const button of buttons) { button.addEventListener('click', create paragraph); }

5. คุณควรเห็นสิ่งเดียวกันหากคุณบันทึกและรีสตาร์ทเบราว์เซอร์ของคุณ แม้ว่าตอนนี้เราจะมี JavaScript ในไฟล์ภายนอกแล้ว แต่ก็ยังทำงานในลักษณะเดียวกัน โดยทั่วไปแล้วสิ่งนี้จะดีในแง่ของการจัดเรียงโค้ดของคุณและทำให้สามารถใช้ซ้ำกับไฟล์ HTML อื่นๆ นอกจากนี้ หากไม่มีสคริปต์จำนวนมาก HTML ก็เข้าใจง่ายขึ้น

ตัวจัดการ JavaScript แบบอินไลน์

โปรดทราบว่าบางครั้งคุณจะพบโค้ด JavaScript จริงที่อยู่ใน HTML ลักษณะที่ปรากฏอาจคล้ายกับสิ่งนี้:

 function createParagraph() { const para = document.createElement('p'); para.textContent = 'You clicked the button!'; document.body.appendChild(para); } <button>Click me!</button>

ยกเว้นตัวจัดการ onclick แบบอินไลน์ขององค์ประกอบ <button> ซึ่งทำให้ฟังก์ชันทำงานทุกครั้งที่มีการคลิกปุ่ม ตัวอย่างนี้มีฟังก์ชันเดียวกันกับสองส่วนก่อนหน้านี้อย่างแม่นยำ

ใช้ addEventListener แทน

ใช้โครงสร้าง JavaScript ล้วนๆ แทนที่จะรวม JavaScript เข้ากับ HTML ของคุณ คุณสามารถเลือกแต่ละปุ่มบนเว็บไซต์โดยใช้เมธอด querySelectorAll() ด้วย addEventListener คุณสามารถวนซ้ำปุ่มต่างๆ และให้แต่ละปุ่มมีตัวจัดการ () นี่คือรหัสสำหรับสิ่งนั้น:

 const buttons = document.querySelectorAll('button'); for (const button of buttons) { button.addEventListener('click', create paragraph); }

แม้ว่าคุณสมบัติ onclick อาจกว้างกว่าคุณสมบัติ onclick เล็กน้อย แต่จะใช้งานได้กับปุ่มทั้งหมด โดยไม่คำนึงถึงจำนวนในหน้า เพิ่มหรือลบ ไม่จำเป็นต้องแก้ไข JavaScript

กลยุทธ์การโหลดสคริปต์

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

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


Java Script ทำอะไรบนหน้าของคุณ?

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

ความปลอดภัยของเบราว์เซอร์

ในทางเทคนิคแล้ว แท็บเว็บแต่ละแท็บมี "สภาพแวดล้อมการทำงาน" ของตัวเองซึ่งใช้เรียกใช้โค้ด ด้วยเหตุนี้ รหัสของแต่ละแท็บจึงถูกเรียกใช้งานโดยอิสระจากส่วนอื่นๆ ไม่สามารถส่งผลต่อโค้ดของแท็บอื่นหรือเว็บไซต์อื่นได้ นี่เป็นข้อควรระวังด้านความปลอดภัยที่ชาญฉลาด เพราะหากไม่เป็นเช่นนั้น แฮ็กเกอร์อาจเริ่มสร้างรหัสเพื่อขโมยข้อมูลจากบริการอื่นๆ และทำสิ่งที่เป็นอันตรายอื่นๆ

JavaScript ทำงานตามลำดับ

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

ตีความกับโค้ดที่คอมไพล์แล้ว

คำว่า "คอมไพล์" และ "ตีความ" อาจใช้เกี่ยวกับการเขียนโปรแกรม ในภาษาการเขียนโปรแกรม โค้ดจะถูกรันจากบนลงล่าง และผลลัพธ์จะถูกส่งกลับทันที ไม่จำเป็นต้องเปลี่ยนรหัสก่อนที่จะเรียกใช้งานโดยเบราว์เซอร์ รหัสจะถูกส่งในรูปแบบข้อความที่โปรแกรมเมอร์ดำเนินการได้ง่าย

ในอีกด้านหนึ่ง ภาษาที่คอมไพล์จะมีการเปลี่ยนแปลง (คอมไพล์) ก่อนที่คอมพิวเตอร์จะใช้งาน ตัวอย่างเช่น C/C++ ถูกแปลงเป็นรหัสเครื่อง ซึ่งคอมพิวเตอร์ดำเนินการ ซอฟต์แวร์ใช้ไฟล์ไบนารีที่สร้างจากซอร์สโค้ดของแอปพลิเคชัน

โค้ดฝั่งเซิร์ฟเวอร์กับโค้ดฝั่งไคลเอ็นต์

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

On the other side, server-side code is executed on the server, after which its results are retrieved and shown in the browser. Popular server-side web language instances include JavaScript, PHP, Python, Ruby, ASP.NET, and more.

Dynamic versus static code

The term “dynamic” refers to updating a web page or app to show various things in different conditions, creating new information as necessary. It is used to define both client-side JavaScript and server-side languages.

While client-side JavaScript dynamically creates new content within the browser on the client, such as creating a new HTML table, completing it with the information provided by the server, and then displaying the table on a website page shown to the user, server-side code dynamically produces new content on the server, such as pulling data from a database. Although the two settings have slightly distinct meanings, they are nevertheless connected, and both strategies (server-side and client-side) typically complement one another.


JavaScript Quickstart Tutorial

We'll quickly review the most significant JavaScript data types in this tutorial.

ก. JavaScript Variables

Data values are stored in containers called variables in JavaScript.

The variables in this example are x, y, and z:

Example

  • var x = 5;
  • var y = 6;
  • var z = x + y;

From the example above, you can expect:

  • x stores the value 5
  • y stores the value 6
  • z stores the value 11

ข. JavaScript Numbers

There is just one kind of number in JavaScript. You can write numbers with or without decimals.

Example

  • var x = 3.14; // A number with decimals
  • var y = 3; // A number without decimals

Double precision floating point numbers are used to hold all numbers.

ค. JavaScript Strings

Text is saved in strings. Strings are enclosed in quotation marks. Single or double quotations are acceptable:

Example

  • var car name = “Volvo XC60”; // Double quotes
  • var car name = 'Volvo XC60'; // Single quotes

The built-in property length contains the string's length:

Example

  • var txt = “ABCDEFGHIJKLMNOPQRSTUVWXYZ”;
  • var sln = txt.length;

ง. วัตถุ JavaScript

You already know that variables in JavaScript serve as storage spaces for data values.

Example:

This program gives the vehicle variable a straightforward value (Fiat):

Objects are variables as well, as in var vehicle = “Fiat.” But different values can exist within an object.

อี JavaScript Arrays

Multiple values can be kept in a single data point using JavaScript arrays.

Example

 var cars = ["Saab", "Volvo", "BMW"];

ฉ. JavaScript Functions

A JavaScript function is a section of code created to carry out a certain purpose.

When “something” calls a JavaScript function, it is carried out (calls it).

Example

 function myFunction(p1, p2) { return p1 * p2; // The function returns the product of p1 and p2 }

How Do You Add JavaScript Code to a Website?

JavaScript code may be added to an HTML web page both inside and externally.

Internal JavaScript employs the <script> tag in the HTML script's body to include all of the JavaScript code.

An illustration of internal JavaScript using the <script> tag:

 <html> <head> <title>Inline JavaScript</title> <script type="text/javascript"> alert("Hello World"); </script> </head> <body> </body> </html>

You can also embed its script on HTML event attributes, prompting the browser to execute it when an event is triggered. This script type is called inline JavaScript:

 <button>Click</button>

On the other hand, external JavaScript involves storing the code in a separate .js file and then recalling it within the HTML page. Developers often use this method when working on large projects, keeping the script organized.

Plus, it lets you reuse the script in multiple HTML pages, which is something that many developers value greatly. For example, adding the following script to an HTML page lets you recall an external JavaScript file named script.js:

<script src="script.js" defer></script>

ต่อไปนี้คือตัวอย่างวิธีอ้างอิงไฟล์ JavaScript ภายนอก:

 <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Time right now:</title> </head> <body> <button type="button">Select</button> </body> <script src="js/script.js"></script> </html>

คุณสามารถสร้างและแก้ไขโค้ด JavaScript โดยใช้โปรแกรมแก้ไขข้อความ


เหตุใดจึงต้องใช้ JavaScript แทนภาษาการเขียนโปรแกรมอื่น

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

  • ภาษาโปรแกรมภาษาเดียวสำหรับเว็บเบราว์เซอร์คือ JavaScript
  • ภาษาที่มีผู้ใช้มากที่สุดคือ JavaScript
  • มีสิ่งกีดขวางทางเข้าต่ำเพื่อเริ่มต้น
  • มันสนุกที่จะเรียนรู้

JavaScript แตกต่างจากภาษาการเขียนโปรแกรมอื่นอย่างไร?

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

ต่อไปนี้เป็นภาษาโปรแกรมที่ใช้กันอย่างแพร่หลายจำนวนหนึ่ง:

ก. ค#

ค#

C# เป็นภาษาโปรแกรมเชิงวัตถุที่ใช้ในการสร้าง แอปพลิเคชันที่เข้ากันได้กับ NET เนื่องจากมันถูกพิมพ์แบบสแตติก การระบุเวลาคอมไพล์ของตัวแปรจึงเป็นไปได้ เนื่องจากตัวดำเนินการและตัวแปลงซ้อนใน C # ซึ่ง JavaScript ขาด คุณอาจเปลี่ยนประเภทข้อมูล

ข. Java

Java

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

ค. PHP

PHP

PHP เป็นภาษาฝั่งเซิร์ฟเวอร์ที่ใช้บ่อยใน WordPress และบริการเว็บอื่นๆ วัตถุประสงค์หลักคือการส่งข้อมูลไปยังและจากเซิร์ฟเวอร์ หน้า HTML ร่วมกัน และติดตามเซสชัน PHP ตรงกันข้ามกับ JavaScript รองรับตัวระบุตัวพิมพ์เล็กและตัวพิมพ์ใหญ่และสามารถรับฐานข้อมูลได้อย่างง่ายดาย

ง. ทับทิม

ทับทิม

Ruby เป็นโปรแกรมเอนกประสงค์ที่อนุญาตให้ทำ metaprogramming ได้ ซึ่งทำให้สามารถศึกษาและเปลี่ยนรหัสและโปรแกรมอื่นๆ ได้ Ruby on Rails ซึ่งเป็นเฟรมเวิร์กที่เป็นที่รู้จักมากที่สุด ทำให้สามารถสร้างแอปพลิเคชันบนเว็บที่ซับซ้อนได้อย่างรวดเร็วและราคาไม่แพง สถาปัตยกรรม Ruby on Rails ทำหน้าที่เป็นอิทธิพลต่อการใช้งาน Node.js ของ JavaScript

JavaScript วันนี้อยู่ที่ไหน

JavaScript เวอร์ชันล่าสุด ECMAScript 2017 เปิดตัวในเดือนมิถุนายนของปีนั้น ภาษาการเขียนโปรแกรมขั้นสูงแบบไดนามิกเรียกว่า JavaScript

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

ข้อกำหนด ECMA-262 ได้กำหนดภาษา JavaScript พื้นฐาน

  • โปรแกรมซอฟต์แวร์ที่เรียบง่ายและตีความได้คือ JavaScript
  • ออกแบบมาสำหรับการพัฒนาแอปพลิเคชันที่เน้นเครือข่าย
  • เชื่อมโยงกับและเสริมกับ Java
  • เชื่อมต่อกับและเสริม HTML
  • เปิดและไม่ขึ้นกับแพลตฟอร์ม

วานิลลาจาวาสคริปต์คืออะไร?

เมื่อเราอ้างถึง JavaScript ล้วนๆ หรือที่เรียกว่า JavaScript แบบธรรมดา โดยไม่มีไลบรารี่เพิ่มเติม เราใช้วลี "vanilla script" “วันนี้ สามารถทำได้หลายอย่างโดยไม่ต้องใช้ไลบรารี JavaScript เพิ่มเติม” เป็นเรื่องตลกทั่วไป

สคริปต์วานิลลาเป็นหนึ่งในเฟรมเวิร์กที่เล็กที่สุดที่เคยสร้างมา ทั้งการเรียนรู้และการใช้งานนั้นง่ายและสะดวกจริงๆ สคริปต์วานิลลาอาจใช้ในการพัฒนาแอปและเว็บไซต์ที่สำคัญและมีประสิทธิภาพ วิศวกรที่สร้าง JavaScript เวอร์ชันแรกมักจะพยายามปรับปรุงและแสดงผลให้เป็นประโยชน์มากขึ้นสำหรับนักพัฒนาเว็บ

ทำไมคุณควรเรียนรู้ Vanilla JavaScript ?

เราเริ่มเรียนรู้และใช้ vanilla js สำหรับโครงการด้วยเหตุผลหลายประการ เราจะพูดถึงสามสิ่งที่สำคัญที่สุดในพวกเขา

1. ประสิทธิภาพของเว็บ

เนื่องจากเป็นส่วนประกอบที่มีราคาแพงและสำคัญที่สุดของ front-end stack จึงดีกว่าสำหรับการออกแบบเว็บไซต์มากกว่าเฟรมเวิร์กและโมดูลอื่นๆ ยกเว้นไฟล์ HTML และ CSS ที่อาจใช้ทันทีหลังจากดาวน์โหลด จะต้องสร้างและประมวลผลโค้ด vanilla js เมื่อเทียบกับไฟล์ Html / CSS ที่มีความยาวเท่ากัน ไฟล์ขนาด 50kb js มีอิทธิพลต่อความเร็วของเว็บไซต์มากกว่ามาก

2. ประสบการณ์ผู้ใช้

นำเสนอประสบการณ์ที่เรียบง่ายแต่เป็นมิตรกับผู้ใช้ในการพัฒนา นักพัฒนาซอฟต์แวร์ต้องเปิดโปรแกรมประมวลผลคำเท่านั้นเพื่อเริ่มเขียนโค้ดเมื่อใช้ JavaScript เพื่อสร้างแอปพลิเคชันหรือเว็บไซต์ นักพัฒนาซอฟต์แวร์ไม่ต้องผ่านกระบวนการที่ลำบาก เช่น การติดตั้ง npm, ขั้นตอนการประกอบ, ไม่มีบิลด์ เป็นต้น

3. ทำให้การทำงานกับกรอบงานง่ายขึ้นเช่นกัน

นอกจากนี้ยังทำให้การจัดการกับนักพัฒนาซอฟต์แวร์ที่เลือกใช้แพลตฟอร์มอื่นต่อไปนั้นน่าพึงพอใจยิ่งขึ้น เราทุกคนต่างตระหนักดีถึงความยากลำบากในการเริ่มใช้กรอบงาน

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

4. โหลดเซิร์ฟเวอร์

เนื่องจากทุกคนรู้ว่า JavaScript ทำงานบนไคลเอนต์มากกว่าบนเซิร์ฟเวอร์ จึงจำเป็นต้องมีการใช้งานเซิร์ฟเวอร์โดยรวมน้อยลง นอกจากนี้ โปรแกรมตรงไปตรงมาไม่ได้ขึ้นอยู่กับเซิร์ฟเวอร์เลย

5. การทำงานร่วมกัน

ตรงกันข้ามกับภาษาโปรแกรมอื่น ๆ JavaScript อาจรวมอยู่ในหน้าเว็บใดก็ได้ ตัวอย่างเช่น PHP

เนื่องมาจากความเข้ากันได้กับภาษาอื่นๆ เช่น PHP, Pearl และอื่นๆ เราอาจใช้มันสำหรับแอปพลิเคชันต่างๆ

6. อินเทอร์เฟซที่หลากหลาย

JavaScript ช่วยให้เราสร้างคุณสมบัติคุณภาพเยี่ยม เช่น ฟังก์ชันลากแล้ววางและองค์ประกอบที่เหมือนตัวเลื่อน ซึ่งอาจส่งผลดีต่อประสบการณ์ของผู้เยี่ยมชมเว็บไซต์

7. ความเร็ว

ความเร็วนั้นโดดเด่นเนื่องจากดำเนินการฝั่งไคลเอ็นต์และไม่ต้องการทรัพยากรภายนอก คำขอไปยังเซิร์ฟเวอร์ส่วนหลังไม่ส่งผลต่อความเร็วในการทำงานของ JavaScript

ความแตกต่างระหว่าง Java และ JavaScript?

พารามิเตอร์ Java JavaScript
พัฒนาโดย James Gosling แห่ง Sun Microsystems ได้สร้างภาษา Java เชิงวัตถุ Netscape ได้สร้าง Javascript ซึ่งเป็นที่รู้จักในชื่อ LiveScript เป็นครั้งแรก
การทำงาน Java เป็นภาษาสคริปต์แบบสแตนด์อโลนที่ทำงานบน Java Virtual Machine (JVM) โดยการเข้ารหัสซอร์สโค้ดแบบไบต์ JavaScript เป็นภาษาโปรแกรมที่ต้องรวมอยู่ในเอกสาร HTML ก่อนที่จะเรียกใช้หรือดำเนินการโดยเว็บเซิร์ฟเวอร์เช่น Chrome, Firefox เป็นต้น
ประเภทภาษา ภาษาการเขียนโปรแกรมเชิงวัตถุแบบคลาสเรียกว่า Java ภาษาการเขียนโปรแกรมตามตัวอย่างคือ JavaScript
ประเภทวัตถุ Java สร้างวัตถุหลังจากสร้างคลาสเนื่องจากเป็นภาษาที่ใช้คลาส ออบเจ็กต์ JavaScript ที่ใช้ต้นแบบถูกสร้างขึ้นจากอ็อบเจ็กต์ต้นแบบเดียว
การประกาศตัวแปร Java เปิดใช้งานการพิมพ์แบบคงที่ ซึ่งจำเป็นต้องมีการประกาศตัวแปรและประเภทก่อนที่จะคอมไพล์และดำเนินการ JavaScript นำเสนอการพิมพ์แบบไดนามิก ทำให้โปรแกรมเมอร์สามารถกำหนดหมวดหมู่และวัตถุได้ทุกเมื่อ ตัวอย่างเช่น ระหว่างประเภทการคอมไพล์ คุณไม่จำเป็นต้องประกาศประเภทของตัวแปร (จำนวนเต็ม ทุ่น ฯลฯ) แม้ตลอดรันไทม์ คุณก็ทำได้
การทำงาน พร้อมกัน (ฟังก์ชั่นของการจัดการคำสั่งต่าง ๆ ในเวลาเดียวกัน) Java ใช้มัลติเธรดเพื่ออำนวยความสะดวกและรับรองการทำงานพร้อมกัน ซึ่งทำให้แอปพลิเคชันมีประสิทธิภาพและรวดเร็วยิ่งขึ้น JavaScript ไม่รองรับการทำงานหลายเหตุการณ์หรือการทำงานพร้อมกันพร้อมกัน
การรวบรวมและการตีความ Java อาจมีทั้งคอมไพล์และตีความ มันถูกแปลเป็นไบต์โค้ดและรันบน JVM JavaScript ถูกตีความโดยตรงบนเว็บเบราว์เซอร์เท่านั้น
การมองเห็นซอร์สโค้ด Java ใช้การเข้ารหัสไบต์เพื่อปกปิดซอร์สโค้ด ทำให้ไม่สามารถอ่านได้โดยไม่ได้รับอนุญาตหรือบุคคลอื่น Javascript ซึ่งเป็นภาษาสคริปต์ รันโค้ดบนเบราว์เซอร์ที่ทุกคนสามารถใช้ได้ในรูปแบบข้อความธรรมดา
ความต้องการ คุณต้องมี Java Development Kit ทั้งหมดเพื่อสร้างและรันโปรแกรม Java (JDK) การเขียนโค้ดสำหรับ JavaScript เพียงต้องการโปรแกรมแก้ไขข้อความ
ไวยากรณ์ ใน Java ต้องกำหนดประเภทข้อมูล JavaScript ไม่ต้องการการประกาศประเภทข้อมูล
ความปลอดภัย Java ได้รับการพัฒนาโดยมีเป้าหมายหลักในการปกป้องซอร์สโค้ด และมีคุณสมบัติที่แข็งแกร่งในการสำรองข้อมูล ภาษาการเขียนโปรแกรมของ JavaScript นั้นไม่ปลอดภัยโดยพื้นฐานเพราะทุกคนมองเห็นได้ในข้อความธรรมดา โปรแกรมเมอร์ต้องรวมคุณสมบัติใหม่เพื่อความปลอดภัยที่เข้มงวด
นามสกุลไฟล์ Java รองรับ ". นามสกุลไฟล์ Java” ที่ “. ระบบไฟล์ JavaScript” เข้ากันได้กับ JavaScript
ความเหมาะสม Java อาจใช้เพื่อสร้างแอปพลิเคชันประเภทต่างๆ รวมถึงแอปพลิเคชันบนเว็บ บริการมือถือ แอปพลิเคชันบนคลาวด์ และเทคโนโลยีบิ๊กดาต้าแอปพลิเคชันของ IoT อย่างไรก็ตาม ด้วยการแก้ไขล่าสุดและการเพิ่ม Node ตอนนี้ JavaScript ถูกใช้เป็นส่วนใหญ่สำหรับการพัฒนา front-side การเขียนโปรแกรมเกม การพัฒนาแอปพลิเคชันออนไลน์และบนมือถือ และการพัฒนาแอปบนเว็บและเซิร์ฟเวอร์ ล้วนใช้สำหรับ JavaScript
ฟีเจอร์หลัก ห้องสมุดขนาดใหญ่ ง่ายและง่ายต่อการเรียนรู้; เป็นที่นิยม เฟรมเวิร์กที่แข็งแกร่งซึ่งมีน้ำหนักเบาและยอดเยี่ยมสำหรับการพัฒนาส่วนหน้า
บริษัทที่ใช้ Google, Netflix, Airbnb เป็นต้น Microsoft, Uber, PayPal ฯลฯ

Java Compiler

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

เอาต์พุตที่สร้างโดยคอมไพเลอร์โดยทั่วไปจะเรียกว่าโค้ดอ็อบเจ็กต์หรือส่วนประกอบของอ็อบเจ็กต์ คำว่า "วัตถุ" ใช้ที่นี่โดยไม่มีการอ้างอิงถึงการเขียนโปรแกรมเชิงวัตถุ คำว่า "รหัสอ็อบเจ็กต์" หมายถึงประเภทของภาษาแอสเซมบลีที่โปรเซสเซอร์รันโปรแกรมครั้งละหนึ่งโปรแกรม

ตัวดำเนินการ JavaScript

โอเปอเรเตอร์ใน JavaScript เป็นสัญลักษณ์เฉพาะที่ใช้ในการดำเนินการกับการดำเนินการทางคณิตศาสตร์ (ค่าและตัวแปร) ในกรณีนี้ 2 + 3; / 5. ที่นี่ ตัวดำเนินการ + ทำการบวก และตัวถูกดำเนินการคือ 2 และ 3

ประเภทตัวดำเนินการ JavaScript

ก. ผู้ปฏิบัติงานที่ได้รับมอบหมาย

ขึ้นอยู่กับต้นทุนของตัวถูกดำเนินการที่ถูกต้อง ตัวดำเนินการมอบหมายมีส่วนในเชิงบวกต่อตัวถูกดำเนินการด้านซ้าย เท่ากับ (=) ตัวดำเนินการกำหนดแบบตรงไปตรงมา โอนค่าของตัวถูกดำเนินการทางขวาไปยังตัวถูกดำเนินการทางซ้าย

ข. ตัวดำเนินการเลขคณิต

ตัวดำเนินการทางคณิตศาสตร์ที่ใช้ได้กับทั้งกลุ่มและจำนวนเต็ม ใน AHDL คำนำหน้าและสัญลักษณ์ไบนารีบวก (+) และลบ (-) เป็นที่ยอมรับในสูตรทางคณิตศาสตร์ในคำสั่งบูลีน

ค. ตัวดำเนินการเปรียบเทียบ

ตัวดำเนินการเปรียบเทียบสามารถประเมินและเปรียบเทียบสตริงหรือตัวเลขได้ ตรงกันข้ามกับนิพจน์ทางคณิตศาสตร์ นิพจน์ตัวดำเนินการเปรียบเทียบจะไม่ส่งกลับผลลัพธ์ที่เป็นตัวเลข นิพจน์เปรียบเทียบให้ผลลัพธ์อย่างใดอย่างหนึ่ง: 1 (ซึ่งระบุว่าเป็นจริง) หรือ 0 (ซึ่งระบุว่าเป็นเท็จ)

ง. ตัวดำเนินการเชิงตรรกะ

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

อี ตัวดำเนินการ Bitwise

เมื่อทำหน้าที่เกี่ยวกับบิตข้อมูลหรือการคำนวณทางคณิตศาสตร์ที่ต้องการการปรับเปลี่ยนแต่ละบิต ตัวดำเนินการระดับบิตจะถูกใช้ ในสแต็กการเชื่อมต่อที่บิตเฉพาะในส่วนหัวที่เกี่ยวข้องกับข้อมูลแสดงข้อมูลที่สำคัญ การดำเนินการระดับบิตจะถูกใช้

ฉ. ตัวดำเนินการสตริง

การดำเนินการหลายประเภทที่เราสามารถทำได้กับตัวแปรในโปรแกรมที่มีประเภทสตริงจะแสดงโดยตัวดำเนินการสตริง

กรัม ตัวดำเนินการอื่นๆ

มีการใช้ตัวดำเนินการอื่นเพื่อดำเนินการทางคณิตศาสตร์และตรรกะบางอย่างบนตัวถูกดำเนินการ ตัวถูกดำเนินการถูกดำเนินการโดยตัวดำเนินการ กล่าวอีกนัยหนึ่ง ใน JavaScript ตัวดำเนินการถูกใช้เพื่อดำเนินการทางคณิตศาสตร์ เปรียบเทียบข้อมูล และทำงานอื่นๆ


เทคโนโลยีที่เกี่ยวข้อง

1. Java

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

2. JSON

JSON หรือ JavaScript Object Notation เป็นรูปแบบไฟล์ระบบเปิดและรูปแบบการแลกเปลี่ยนข้อมูลที่ใช้ภาษาที่มนุษย์สามารถอ่านเพื่อจัดเก็บและส่งข้อมูลออบเจ็กต์ที่ประกอบด้วยคู่และกลุ่มค่าแอตทริบิวต์ (หรือค่าที่ทำให้เป็นอนุกรมได้อื่นๆ) เป็นรูปแบบข้อมูลที่ใช้กันอย่างแพร่หลายสำหรับการแลกเปลี่ยนข้อมูลทางอิเล็กทรอนิกส์ โดยเฉพาะระหว่างเซิร์ฟเวอร์และแอปพลิเคชันออนไลน์

3. WebAssembly

นอกเหนือจากการกำหนดรูปแบบโค้ดไบนารีขนาดกะทัดรัดและรูปแบบข้อความที่เกี่ยวข้องสำหรับโปรแกรมที่ใช้งานได้ WebAssembly (มักเรียกย่อว่า Wasm) ยังระบุโปรโตคอลซอฟต์แวร์สำหรับการโต้ตอบระหว่างแอปพลิเคชันดังกล่าวและผู้รวมระบบที่ง่ายขึ้น

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

4. ทรานสพิลเลอร์

นักแปลจากต้นทางถึงซอร์สหรือที่เรียกว่าคอมไพเลอร์ S2S, ทรานส์คอมไพเลอร์ หรือทรานสปิลเลอร์ แปลงซอร์สโค้ดของโปรแกรมเป็นซอร์สโค้ดที่เทียบเท่ากันในภาษาการเขียนโปรแกรมอื่น

บริษัทใดใช้จาวาสคริปต์?

1. Microsoft

ในการสร้างเว็บเบราว์เซอร์ Edge Microsoft ต้องทำงานร่วมกันอย่างใกล้ชิดกับ JavaScript Microsoft ได้สร้างและดำเนินการตัวประมวลผล JavaScript สำหรับ Edge เนื่องจากการประมวลผลและการใช้งาน JavaScript ที่รวดเร็วเป็นข้อกำหนดสำหรับเบราว์เซอร์ทั้งหมด อันที่จริง มีการพูดคุยกันถึงการสร้าง NodeJS เวอร์ชันอื่นที่ใช้เอ็นจิ้น Edge

2. PayPal

ที่ส่วนหน้าของหน้าเว็บ PayPal ใช้ JavaScript อย่างไม่ต้องสงสัยเป็นเวลานาน แต่นี่เป็นเพียงจุดเริ่มต้นเท่านั้น หนึ่งในผู้ใช้รายแรกๆ ของ NodeJS คือผู้นำในอุตสาหกรรมการชำระเงินออนไลน์

3. Netflix

คล้ายกับ PayPal ในตอนแรก Netflix ทำเกือบทุกอย่างใน Java พวกเขายังประสบปัญหาเนื่องจากขนาดและความยาวของ Java ในการพัฒนา

เมื่อมีการเปิดตัว NodeJS Netflix ค่อยๆ ขยับไปไกลกว่าโครงสร้างองค์กรแบบเดิมและมุ่งสู่ระบบคลาวด์

4. Uber

Uber ต้องจัดการข้อมูลจำนวนมหาศาลภายในระยะเวลาอันสั้น พวกเขาได้รับคำขอนับล้านทุกวัน และไม่ได้มีเพียงการดูหน้าเว็บเท่านั้น Uber ต้องตรวจสอบตำแหน่งของคนขับ ผู้โดยสาร และคำขอการเดินทางขาเข้า ต้องกรองข้อมูลดังกล่าวอย่างมีประสิทธิภาพและจับคู่ผู้ขับขี่ได้อย่างรวดเร็ว

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

5. Facebook

อย่างที่คุณรู้ Facebook ใช้ประโยชน์จาก JavaScript มันค่อนข้างยากที่จะพลาด จาวาสคริปต์ที่ใช้ในการสร้าง Facebook และจำนวนที่ Facebook มีส่วนร่วมในการพัฒนา JavaScript ดูเหมือนจะไม่ชัดเจน

6. Google

Google สร้างและมักทำให้เครื่องมือ JavaScript ใช้งานได้ ภาพประกอบที่โดดเด่นที่สุดคือ AngularJS Angular ได้กลายเป็นหนึ่งในเฟรมเวิร์กส่วนหน้าที่เป็นที่ชื่นชอบมากที่สุด และมักใช้ในแพลตฟอร์มโฆษณา DoubleClick ของ Google

ทางเลือกของ JavaScript

1. โผ

Dart สร้างขึ้นเพื่อประสิทธิภาพการทำงาน ทำให้ทำงานให้เสร็จได้ง่ายกว่า JavaScript แม้ว่า Google จะพัฒนามาบ่อยครั้ง แต่ก็ยังมีฟีเจอร์น้อยกว่า JavaScript

2. TypeScript

Microsoft ได้สร้าง TypeScript เพื่อปรับปรุงการทำงานของ JavaScript ผู้ใช้ส่วนใหญ่ถือว่าโค้ด TypeScript มีประสิทธิภาพและมีแนวโน้มที่จะเกิดข้อผิดพลาดน้อยกว่า และพวกเขายังเชื่อว่าโค้ดนั้นค่อนข้างจะยุ่งยากและยุ่งยาก

3. CoffeeScript

เพื่อการอ่านที่ง่ายขึ้น โค้ดที่สั้นกว่า และง่ายกว่า ภาษา CoffeeScript จะถูกแปลงเป็น JS แต่คุณจะต้องเป็นผู้เชี่ยวชาญใน JavaScript หากคุณใช้ CoffeeScript

4. เอล์ม

Elm เป็นภาษาที่ใช้งานได้จริงที่ค่อนข้างใหม่และมีสภาพแวดล้อมการพัฒนาเว็บส่วนหน้าระดับไฮเอนด์ มักใช้ในการสร้างส่วนต่อประสานกับผู้ใช้แบบเห็นภาพ ระบบประเภทที่ซับซ้อนของภาษานี้รับประกันได้ว่าโปรแกรมที่ใช้งานจริงจะไม่มีวันผิดพลาดขณะรันไทม์

5. งูหลาม

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

6. คอตลิน

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

7. ทับทิม

Ruby เป็นภาษาสคริปต์เชิงวัตถุที่พิมพ์แบบไดนามิกและทรงพลัง พร้อมด้วยไวยากรณ์ที่ค่อนข้างตรงไปตรงมาซึ่งคล้ายกับภาษาอังกฤษอย่างยิ่ง แม้ว่าจะช้ากว่า Python เล็กน้อย แต่ก็เป็นหนึ่งในทางเลือกที่ใช้กันอย่างแพร่หลายมากที่สุด

8. PHP

ด้วยคุณลักษณะที่ปรับเปลี่ยนได้และสมบูรณ์แบบ PHP ได้รับการกล่าวขานว่าเป็นภาษาโปรแกรมแบ็คเอนด์แห่งอนาคต เนื่องจากไวยากรณ์ที่อธิบายได้ดีมากของภาษานี้ คุณจึงมีความยืดหยุ่นในการสร้างสรรค์บ้าง

9. ตอบกลับเจ้าของภาษา

โมเดลกระบวนการโอเพ่นซอร์ส React Native ใช้ในการสร้างแอปข้ามแพลตฟอร์มแบบเนทีฟ มันใช้ประโยชน์จากภาษาการเขียนโปรแกรม React และ JavaScript เพื่อสร้างแอปพลิเคชั่นมือถือที่เกือบจะเหมือนกับแอพดั้งเดิมที่สร้างใน Java หรือ Objective-C

10. NativeScript

เฟรมเวิร์กที่มีประโยชน์อย่างยิ่งอีกประการหนึ่งสำหรับการสร้างแอปข้ามแพลตฟอร์มดั้งเดิมที่ใช้ JavaScript หรือ TypeScript คือ NativeScript ฐานรหัสเดียวอาจเผยแพร่บนหลายแพลตฟอร์ม รวมถึง Android และ iOS โดยใช้เครื่องมือการแบ่งปันรหัส เช่น Angular หรือ Vue.js

11. อิออน

เฟรมเวิร์ก JavaScript ที่ได้รับความนิยมอีกประการหนึ่งสำหรับการสร้างแอปไฮบริดคือ Ionic เมื่อติดตั้งซอฟต์แวร์หลักเข้ากับอุปกรณ์ นักพัฒนาอาจใช้ปลั๊กอิน Cordova ที่อนุญาตให้ผู้ใช้เข้าถึงอุปกรณ์และซอฟต์แวร์จากอุปกรณ์เคลื่อนที่ดังกล่าว

นอกเหนือจากโอกาสในอนาคตส่วนหน้าและส่วนหลังที่กล่าวถึงแล้ว คุณอาจต้องการดูทางเลือกเว็บแอปพลิเคชันที่เกี่ยวข้อง

12. ClojureScript

การแทนที่ JavaScript ที่เชื่อถือได้ซึ่งเรียกว่า ClojureScript ทำให้การแปลภาษาการเขียนโปรแกรม Clojure เป็น JavaScript เป็นเรื่องง่าย ทำงานบน Java Virtual Machine, Clojure จะเป็น Lisp ที่สามารถเข้าถึงไลบรารี Java ปัจจุบันทั้งหมดได้

13. บาเบล

เวอร์ชัน ES5 ของสคริปต์ ECMA เข้ากันได้กับ JavaScript แต่ ES6 มีความสามารถที่น่าสนใจหลายอย่างที่ JavaScript ไม่สนับสนุนในขณะนี้ โค้ด ES6 JavaScript ของคุณจะถูกแปลงเป็นโค้ด JS ที่สอดคล้องกับ ES5 โดยใช้ Babel คอมไพเลอร์

ห่อ

แน่นอน JavaScript มีคู่แข่งมากมายในโลกสมัยใหม่ การเปลี่ยนจาก Node.js ไปเป็นภาษาโปรแกรมอื่น ๆ ที่ใช้กันอย่างแพร่หลายนั้นค่อนข้างง่าย รวมถึง Python, C, C++, Kotlin, Ruby, Smalltalk และอื่นๆ โดยเฉพาะอย่างยิ่งสำหรับสคริปต์หรือแอปพลิเคชันทั่วไป

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

คุณอาจชอบอ่าน
  • ความแตกต่างระหว่าง React Typescript, React JavaScript และ React Native
  • กรอบงานการพัฒนาเว็บยอดนิยม (ส่วนหน้าและส่วนหลัง)
  • สุดยอดกรอบการพัฒนาแอพข้ามแพลตฟอร์ม
  • Full Stack Development คืออะไร? บทนำสั้นๆ