20 Coding Techniques ของ JavaScript ที่เรียบง่ายแต่มีประโยชน์
11-ต.ค.-23
คัมภีร์เทพ IT
ปัจจุบัน JavaScript ถูกใช้งานอย่างแพร่หลาย และได้รับความนิยมเป็นอย่างมาก และบทความนี้ก็คือ 20 Coding Techniques ของ JavaScript ที่เรียบง่ายแต่มีประโยชน์ ซึ่งคุณสามารถนำไปประยุกต์ใช้ในการทำงานของคุณได้
1. Scroll ไปที่ด้านบนของ Page
เราสามารถใช้ window.scrollTo() เพื่อ Scroll ไปด้านบนของ Page ได้อย่างราบรื่น
2. Scroll ไปที่ด้านล่างของ Page
หากคุณทราบความสูงของ Document คุณสามารถ Scroll ไปที่ด้านล่างของ Page ได้อย่างง่ายดาย
3. Scroll Elements ไปที่ Visible Area
บางครั้งเราต้อง Scroll Elements ต่าง ๆ ไปยัง Visible Area เราจะทำอย่างไรได้บ้าง? การใช้ scrollIntoView ก็น่าจะเพียงพอแล้ว
4. แสดง Element ใน Fullscreen Mode
คุณอาจพบกับสถานการณ์เช่นนี้ เมื่อคุณต้องเล่นวิดีโอ Full Screen และเปิด Page แบบ Full Screen ใน Browser
5. Exit Browser Full-screen State
สิ่งนี้สามารถใช้กับข้อที่ 4 ในกรณีที่คุณต้องการออกจาก Full-screen State ของ Browser
6. ดู Type ของ Data
เราจะดู Data Type ของ Variable โดยใช้ Function ได้อย่างไร?
7. Stop Bubbling Events
มันเป็นเรื่องจำเป็น ที่จะต้องมีการป้องกัน Event Bubbling ที่ใช้ได้กับทุก Platforms
8. Copy Object (ทั้งหมด)
คุณจะ Copy Object ที่ซ้อนกันลึก ๆ หลายชั้น ได้อย่างไร?
9. การกำหนด Type ของ Device
เรามักจะต้องทำสิ่งนี้ เพื่อแสดง Logic A บน Phone และ Logic B บน PC โดยพื้นฐานแล้ว Device Type จะถูกกำหนดโดยการจดจำ userAgent ของ Browser
10. ตรวจสอบว่า Device นั้นเป็น Android หรือ iOS
นอกจาก การแยกแยะว่าเป็น Mobile หรือ PC แล้ว หลายครั้งเรายังต้องแยกแยะด้วยว่า Device ปัจจุบันเป็น Android หรือ iOS
11. ดู Type และ Version ของ Browser
ในฐานะของ Front-end Developer คุณอาจประสบปัญหาความเข้ากันได้ (Compatibility) ต่าง ๆ ในขณะเดียวกันคุณอาจจำเป็นต้องดู Type และ Version ของ Browser ด้วยเช่นกัน
12. Set Cookies
13. Get Cookies
14. Delete Cookies
แนวคิดในการลบ Cookies คืออะไร? จริง ๆ แล้ว เพียงแค่ตั้งเวลาหมดอายุ เมื่อถึงเวลามันก็จะหมดอายุทันที
15. Generate Random String
เชื่อว่า คุณอาจเคยต้อง Generate Random String มาบ้าง คุณสามารถเรียนรู้ได้จาก Tool Function นี้
16. ทำให้อักษรตัวแรกของ String เป็นตัวพิมพ์ใหญ่
17. Generate Random Numbers ใน Range ที่กำหนด
บางทีเพื่อวัตถุประสงค์ในการ Test คุณอาจจำเป็นต้อง Generate Random Numbers ใน Range ที่กำหนด
18. สับเปลี่ยนลำดับแบบสุ่ม ๆ ของ Array
เราจะสับเปลี่ยนลำดับแบบสุ่ม ๆ ของ Array ได้อย่างไร?
19. การ Random Value จาก Array
หากคุณต้องทำ Project ที่เกี่ยวกับการ Random Value จาก Array แนะนำให้ดูตัวอย่างจากด้านล่างนี้
20. จัด Format ของเงิน
วิธีที่ 1:
วิธีที่ 2:
หวังว่า คุณจะนำ Coding Techniques ของ JavaScript เหล่านี้ ไปประยุกต์ใช้งานกับการทำงานจริงของคุณได้
ที่มา: https://fatfish.medium.com/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
บทความล่าสุด