Why we type(script) | https://unsplash.com/photos/azft6PuI3Ug

เขียน TypeScript กันทำไมนะ

Published in

odds.team

2 min readDec 1, 2020

อยากเล่าเกี่ยวกับการมาเขียน TypeScript ของตัวเอง จากที่เมื่อก่อนเรายังเตาะแตะอยู่ในโลกของ JavaScript อยู่เลย ยังเป็นมือใหม่หัดลองนู่นนี่ ก็เห็นเห้ยเจ๋งจังเลยเรียน JS ตัวเดียวก็พอแล้วนิ เขียนได้ทั้ง frontend, backend, mobile, desktop ครบจบเลย ดีจัง 😃

แต่เมื่อผมลองเขียนไปสักพักก็เจอว่าเห้ย ทำไมมันมีบั๊กตรงนี้นะ ตัวแปรนี้มันมีข้อมูลอะไรให้ใช้บ้าง ทำไมบางทีมันส่งมาเป็น undefined เสียเวลานั่ง debug เป็นวัน

ความตลก ๆ ในการใช้ == และ === ในการเปรียบเทียบข้อมูลที่ให้ผลลัพธ์แตกต่างกันไป อารมณ์ประมาณมุกด้านล่าง

JavaScript Meme Explaining | https://www.freecodecamp.org/news/explaining-the-best-javascript-meme-i-have-ever-seen/

เลยสงสัยจังเล้ย ว่าทำไงดีนะให้ เห้ยเขียน unit test จะช่วยเราได้หรือเปล่านะ ก็รู้สึกว่าพอช่วยได้ประมาณนึง แต่ปัญหาก็ไม่ได้หมดไป ก็ต้องมา debug กันอยู่

แล้วเราก็มาเจอกัน… TypeScript ได้ยินเกียรติศักดิ์ของภาษานี้มาสักพักใหญ่ เริ่มรู้จักภาษาจากการไปลอง Angular ก็แบบเห้ยดี ช่วยเป็น document ให้เราประมาณนึงได้เลยว่าข้อมูลตัวแปรที่ประกาศอยู่ในโค้ด จะมี Data อะไรบ้าง

TypeScript

TypeScript is superset of JavaScript หมายความว่าความสามารถอะไรที่เราเคยเขียนใน JavaScript สิ่งเหล่านั้นมีอยู่ใน TypeScript ทั้งสิ้น อีกทั้งยังมีเรื่องฟีเจอร์ใหม่ ๆ ใน JavaScript ที่ยังอยู่ใน stage ต่าง ๆ ที่ยังไม่ถูกนำมาใช้ใน core หลักของ JavaScript เอง

อีกทั้งความที่ถ้าเราประกาศ Type ให้โปรแกรมของเรา เราก็สามารถรู้ได้เลยว่ามีส่วนไหนของโปรแกรมที่ทำงานไม่ถูกต้องอยู่ เพราะ TypeScript มีตัว Complier ช่วยบอกเรา นั่นเองจึงทำให้ภาษานี้ได้รับความนิยมเพิ่มขึ้นในศักราชนี้ Enterprise ต่างก็หยิบเอาภาษานี้มาใช้หากจะต้องเขียน JavaScript เนื่องจากช่วยลดขั้นตอนการ Debug และเหมาะมากกับทีมที่จะมาใช้ modern frontend framework เช่น Angular, React หรือ Vue

ตัวผมเริ่มศึกษาไปเจอหนังสือเล่มนึง ที่ช่วยเป็นแนวทางในการหัดเขียนภาษานี้

Introduction

Edit description

basarat.gitbook.io

และ TypeScript เองก็มี Utility Types ที่ช่วยให้เราสนุกกับการเขียน type ขึ้น

Documentation - Utility Types

TypeScript provides several utility types to facilitate common type transformations. These utilities are available…

www.typescriptlang.org

หากใครคิดว่า TypeScript ก็ดีนะ แต่เอาไว้เริ่มใหม่โปรเจกต์หน้าละกัน talk นี้ของพี่ Thai Pangsakulyanont อาจช่วยคุณได้ในการทำให้ JavaScript Project ของเพื่อน ๆ เริ่มมี Type

Embracing gradual typing

How to gradually adopt TypeScript in a large existing JavaScript project effectively? That's the topic for this talk…

dt.in.th

หากอ่านมาถึงตรงนี้มีอะไรแล้วคิดว่ามีอะไรผิดพลาด หรือตกหล่นอะไร อยากรบกวนช่วยกันคอมเมนต์เข้ามาได้เลยนะครับ หรือสงสัยอะไรอยากถามก็ได้เช่นกัน เพื่อที่เพื่อน ๆ คนอื่นที่มาอ่านบทความนี้จะได้เนื้อหาที่ถูกต้องและสมบูรณ์ครับ 🙂

อ้างอิง

https://www.typescriptlang.org/docs/handbook/utility-types.html

https://basarat.gitbook.io/typescript/

Special Thanks

ขอขอบคุณ “สำนักงานส่งเสริมเศรษฐกิจดิจิทัล (depa)” และคณาจารย์ “คณะเทคโนโลยีสารสนเทศ มจธ. (SIT)” ที่ให้การสนับสนุน “ทุนเพชรพระจอมเกล้าเพื่อพัฒนาเทคโนโลยีและนวัตกรรมดิจิทัล (KMUTT-depa)” ซึ่งเป็นทุนที่มอบความรู้ ทักษะและโอกาสดีในการฝึกฝนพัฒนาทักษะที่มีอยู่ให้เฉียบคมมากยิ่งขึ้นครับ ❤️