บทความ IT เจ๋งๆ
12 JavaScript Functions ที่มีประโยชน์ต่อ Web Developer
12-ก.ค.-23
คัมภีร์เทพ IT
ดูเหมือน Function จะเป็นสิ่งที่ Developers ทุกคนใช้งานกันแทบจะตลอดเวลา และบทความนี้จะมาแนะนำ 12 JavaScript Functions ที่มีประโยชน์ต่อ Web Developer ซึ่งหากคุณนำพวกมันไปประยุกต์ใช้ จะสามารถช่วยเร่ง Software Development Process และประหยัดเวลาทำงานไปได้อีกเยอะ
1. ดึง Item แรก/สุดท้ายจาก JavaScript Array
หากคุณทำงานกับ JavaScript เชื่อว่าคุณคงเคยต้องการ Element แรกของ Array สำหรับการใช้งานแล้ว คุณสามารถสร้าง Head Function อย่างง่ายที่สามารถใช้กับ Array และจะ Return Item แรกกลับมาให้
นอกจากนี้คุณยังสามารถสร้าง Last Function ใน JavaScript ซึ่งจะดึง Item สุดท้ายจาก Array ได้เช่นกัน
2. Comma Operator ใน JavaScript
Comma Operator ใน JavaScript อาจจะดูมีความซับซ้อนในตอนแรก แต่อันที่จริง มันก็ไม่ได้ยากขนาดนั้น
คุณสามารถดู JavaScript Snippet ด้านล่างนี้ เพื่อช่วยให้คุณเข้าใจได้ดีขึ้น:
3. Copy อะไรก็ตามลงใน Clipboard
ในขณะที่พัฒนา Website บางครั้งคุณก็ต้องการ Copy Content ที่ต้องการลงใน Clipboard เพื่อเพิ่มความสามารถในการใช้งาน
ใน JavaScript สามารถทำได้โดยใช้ Document (วิธีเก่า) หรือใช้ Navigator Component (วิธีใหม่)
4. Nested Destructuring ใน JavaScript
Destructuring ถือเป็นหัวข้อที่สำคัญของ JavaScript
สำหรับ Snippet ด้านล่างนี้ จะแสดงการ Restructure ของ Object อย่างง่าย โดยทำการแยกตัวแปรเพียง 2 ตัวออกจาก Object
5. เพิ่ม Global Function ที่มีอยู่ให้กับ Object
ใน JavaScript มันเป็นไปได้ที่จะปรับเปลี่ยน Object ใด ๆ ด้วยวิธีการใหม่
JavaScript Snippet ต่อไปนี้ จะแสดงวิธีการเพิ่ม toUpperCase Function ลงใน Array
แนวคิดนี้ถูกเรียกว่า Prototype Inheritance นั่นเอง
6. แปลง Arrays เป็น Objects ใน JavaScript
JavaScript มี Object.fromEntries Function ที่สามารถถูกใช้เพื่อแปลง Input Array ไปเป็น Object
7. รับ Fibonacci ของจำนวนแบบซ้ำ ๆ
Recursion เป็นแนวคิดที่ Software Developer ทุกคนควรรู้จักไว้
JavaScript Snippet นี้ จะแสดง Fibonacci Function ที่ถูกใช้งานในลักษณะที่มีการเรียกซ้ำ ๆ
8. ตรวจสอบว่า วันนั้น ๆ ตรงกับวันหยุดสุดสัปดาห์หรือไม่
JavaScript Snippet นี้แสดงให้เห็นว่าทุก ๆ Date Object สามารถถูกตรวจสอบได้ง่ายว่า เป็นวันหยุดสุดสัปดาห์หรือไม่
คุณสามารถเปลี่ยนจาก หมายเลขของวันหยุด (6 และ 0) แล้วแทนที่ด้วยหมายเลขของวันธรรมดา เพื่อตรวจสอบวันอื่น ๆ
9. แปลงรูปแบบเวลา 24 ชั่วโมงเป็น am/pm
การทำงานกับ Time Formats ต่าง ๆ อาจเป็นเรื่องที่น่าปวดหัวสำหรับหลาย ๆ คน
JavaScript Snippet อย่างง่ายนี้ แสดง Function สำหรับแปลงเวลาแบบ 24 ชั่วโมง ให้เป็นเวลาในรูปแบบ am/pm
10. ตรวจสอบว่ามี Properties อยู่ใน Objects หรือไม่
บางครั้ง คุณต้องการตรวจสอบว่า มี Properties อยู่หรือไม่ ก่อนที่จะ Print หรือใช้งานพวกมัน
แทนที่จะทำ if property !== undefined ก่อนที่จะใช้งานมัน คุณสามารถใช้ Function ที่ JavaScript สร้างขึ้นมาเพื่อทำสิ่งนี้
และเมื่อใช้ร่วมกับ nullish coalescing operator ก็จะทำให้ JavaScript Snippet ของคุณ Clean มากขึ้นไปอีก
11. ตรวจสอบใน Array ว่ามี Values ที่เหมือนกันหรือไม่
ในบางสถานการณ์ คุณอาจต้องการจะทราบว่า ใน 2 Arrays มี Values ที่เหมือนกันหรือไม่
JavaScript Snippet นี้มี containSameValues Function ซึ่งทำสิ่งนี้โดยการ Sort และ Join Array ทั้งสอง แล้วทำการเปรียบเทียบ Strings ของพวกมัน
โปรดทราบว่า Arrays จะต้อง Sort ได้ เพื่อที่จะสามารถเปรียบเทียบ Values ได้อย่างถูกต้อง
12. ตรวจสอบว่า ตัวแปรอยู่ใน Range ที่กำหนดหรือไม่
เชื่อว่า JavaScript Function นี้ น่าจะมีประโยชน์มากสำหรับหลาย ๆ คน
มันจะช่วยตรวจสอบว่า ตัวแปรอยู่ใน Range ที่กำหนดหรือไม่ และถ้าไม่ใช่ ก็จะยึดตัวแปรนั้นไว้ตรง ค่าที่ใกล้เคียงที่สุด กับค่าต่ำสุดหรือค่าสูงสุด
Bonus: สลับ 2 ตัวแปรได้ภายในหนึ่งบรรทัด
นี่ไม่ใช่ JavaScript Function แต่ก็เป็นวิธีที่ยอดเยี่ยมที่สามารถใช้ในการสลับตัวแปร 2 ตัว
มันแสดงให้เห็นว่า เราสามารถทำสิ่งนี้ได้ภายในบรรทัดเดียว แทนที่จะใส่ค่าลงใน “Temporary” Object (ซึ่งอาจจะต้องทำในภาษา Programming อื่น ๆ )
หวังว่าบทความนี้ จะมีประโยชน์กับคุณ คุณสามารถนำพวกมันไปประยุกต์ใช้กับ Projects ต่าง ๆ ของคุณได้ และเชื่อว่า Functions เหล่านี้จะช่วยให้คุณทำงานง่ายขึ้น
ที่มา: https://javascript.plainenglish.io/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
|
|
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
|
|
บทความล่าสุด