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 เป็นเพื่อนนะคะ

เพิ่มเพื่อน

 

บทความล่าสุด