3 เคล็ดลับสุดเจ๋ง ของการใช้งาน JavaScript

27-ธ.ค.-19

คัมภีร์เทพ IT

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

เคล็ดลับที่ 1 : การ Identify ว่า ตัวแปรมี Data Type แบบ Primitive หรือ Non-Primitive

ใน JavaScript จะมี Data Type ทั้งแบบ Primitive และ Non-Primitive โดย Primitive Type ประกอบไปด้วย Boolean, String, Number, BigInt, Null, Symbol และ Undefined ส่วน Non-Primitive Types ประกอบไปด้วย Objects

เชื่อว่ามีบ่อยครั้ง ที่เราอาจจำเป็นต้องระบุ Type ของ Value ที่เก็บไว้ในตัวแปร ว่าเป็นแบบ Primitive หรือ Non-Primitive

ลองพิจารณาตัวแปรที่ด้านล่างนี้ดู:

ซึ่งเราสามารถทำได้ด้วยความช่วยเหลือของ Code Snippet ง่าย ๆ:

เรากำลังใช้ Object Constructor ในการสร้าง Wrapper Object สำหรับ Value

ถ้า Value เป็นแบบ Primitive Data Type, Object Constructor จะสร้าง Wrapper Object สำหรับ Value

ถ้า Value เป็นแบบ Non-Primitive Data Type (Object), Object Constructor จะให้ Object ที่เหมือนกัน ออกมา

ดังนั้น การตรวจสอบอย่างเคร่งครัด (!== or ===) สามารถช่วยให้เราระบุว่า ตัวแปรเป็นแบบ Primitive และ Non-Primitive Type

เคล็ดลับที่ 2 : การสร้าง Pure Object ใน JavaScript

ก่อนที่จะสร้าง Pure Object อยากให้ทำความเข้าใจกันก่อนว่า “Pure Object คืออะไร”

Pure Object ใน JavaScript หมายถึงว่า มันไม่ควรมี Function ใด ๆ ใน Prototype ของมัน

Object ถูกสร้างขึ้นด้วย Syntax ต่อไปนี้

เมื่อทำการตรวจสอบ obj.__proto__ เราได้รับ Function มากมาย ที่มีอยู่ภายในของมัน

แล้วถ้าหากเราต้องการที่จะสร้าง Object ที่ไม่มี Prototype Functions อยู่ภายในล่ะ?

เราสามารถทำได้โดยใช้ Create Method ของ Object Constructor

เมื่อทำการตรวจสอบ Prototype ของ Object เราจะได้ผลลัพธ์ดังต่อไปนี้

ซึ่งก็คือ Object ที่ไม่มี Prototype นั่นคือ Pure Object ได้ถูกสร้างขึ้นเรียบร้อยแล้ว

เคล็ดลับที่ 3 : การ Remove ค่าที่ซ้ำกัน (Duplicate) ออกจาก Array

พิจารณา Array ในตัวอย่างต่อไปนี้

เราสามารถเห็นได้ว่า Element ที่ซ้ำกัน (Duplicate) อยู่มากมายใน Array และเพื่อลบ Element ที่ซ้ำกันออกจาก Array เราสามารถใช้ Set ในการทำสิ่งนั้นได้

Set Object จะช่วยให้เราสามารถเก็บเฉพาะค่าที่ไม่ซ้ำกัน (Unique) ได้เท่านั้น Set ไม่อนุญาตให้มีค่าซ้ำกันได้ คุณสามารถอ่านเพิ่มเติมเกี่ยวกับเรื่องนี้ได้ใน MDN Web Docs

กรณีที่เราต้องการลบค่าที่ซ้ำกัน (Duplicate) ออกจาก Array เราสามารถเขียน Code ได้ดังนี้

ตอนนี้เราได้สร้าง Set ใหม่ที่มีเฉพาะค่าที่ไม่ซ้ำกันของ Array แล้ว จากนั้นเพียงแค่นำมันไปใส่ใน Array ใหม่อีกครั้ง

จากตัวอย่างล่าสุดด้านบน ตรง … ก็คือ Spread Operator ซึ่งคุณสามารถอ่านเพิ่มเติมเกี่ยวกับเรื่องนี้ใน MDN Web Docs ได้เช่นกัน ทำให้ตอนนี้เราได้ Array ที่มีค่าที่ไม่ซ้ำกันเรียบร้อยแล้ว

ที่มา:  https://medium.com/

 

 

ดูตำแหน่งงานที่ใช้ทักษะ JavaScript ได้ที่นี่

รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert

 

อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ

เพิ่มเพื่อน

 

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