รู้จักกับ TypeScript - ประวัติของภาษาที่เติมไทป์ให้กับ JavaScript

ในบทความนี้จะเล่าถึงที่มาที่ไปของ TypeScript อย่างเดียวนะ ส่วนเรื่องสอนว่าใช้งานยังไงได้บ้าง จะเขียนอีกทีในบล็อกต่อๆ ไป

สำหรับภาษาโปรแกรมทุกวันนี้ ถ้าแบ่งคร่าวๆ ด้วยชนิดของตัวแปร เราจะแบ่งได้ 2 อย่าง คือ Static Type: ต้องกำหนดชนิดตัวแปร เช่น int, string ตั้งแต่สร้างตัวแปร และ Dynamic Type ตัวแปรประเภทนี้ไม่ต้องบอกว่าเก็บค่าชนิดไหน เปลี่ยนไปได้เรื่อยๆ

สำหรับภาษาแบบ Dynamic Type ที่ไม่ต้องกำหนดชนิดตัวแปรให้แน่นอน จะเซ็ตค่าเป็นอะไรก็ได้นั้นอาจจะทำให้เขียนง่าย แถมบางภาษาเช่น Python ไม่ต้องประกาศตัวแปรก่อนใช้ด้วยซ้ำ อยากใช้ก็ใช้เลย

Static Type

int x;
x = 10;
x = "str"; //Type Error!

Dynamic Type

x = 10
x = "str" #Ok!

แต่สำหรับระยะยาวและโปรเจคขนาดใหญ่ที่มีความซับซ้อนสูงมากๆ การที่ไม่ต้องประกาศ/กำหนดชนิดตัวแปรทำให้เกิดปัญหาตามมามากมาย ยิ่งถ้าต้องทำงานเป็นทีมร่วมกันแล้ว ถ้าเราไม่รู้ว่าตัวแปรตัวนี้เป็นชนิดอะไร จะทำให้เสียเวลาไล่โค้ดนานมาก

ลองดูตัวอย่างต่อไปนี้

def sum_product_price(data):
  total = 0
  for product in data['products']:
    total += product.price
  return total

จะเห็นว่าการที่ตัวแปรสร้างเป็นไทป์อะไรก็ได้ทำให้เวลาอ่าน/แก้ไขโค้ดทำได้ยากมาก เพราะไม่รู้ structure ของตัวแปร เช่น data ที่เราต้องมาจำเองว่ามันมีฟิลด์ชื่อ products และเป็นอ็อบเจคที่มี .price

โค้ดที่เขียนเองอาจจะไม่เท่าไหร่ แต่ถ้าเป็นโค้ดที่เขียนต่อจากคนอื่น อันนี้มีงงแน่นอน

ช่วงหลังๆ มีหลายภาษาที่เริ่มต้นจากการเป็นภาษา Dynamic Type แต่ก็ต้องเพิ่มฟีเจอร์ให้กำหนดตัวแปรได้มาภายหลัง เช่น PHP (กำหนดไทป์ได้ตั้งแต่เวอร์ชัน 7) และ Python (กำหนดไทป์ได้ตั้งแต่เวอร์ชัน 3.6)

JavaScript ก็เป็นหนึ่งในนั้น แต่สำหรับ JavaScript นั้นมีความแปลกกว่าภาษาอื่นนิดหน่อย เพราะถ้าเราต้องการใช้ไทป์ในภาษานี้ เราจะต้องเขียนมันด้วย TypeScript ซึ่งเป็นภาษาอีกตัวหนึ่งจากทาง Microsoft ที่พอเขียนเสร็จแล้วมันจะคอมไพล์กลับมาเป็น JavaScript อีกทีหนึ่ง

ดังนั้นคำแนะนำในการเขียน JavaScript ข้อแรกคือ ..

อย่าเขียน JavaScript แต่ให้เขียน TypeScript แทน !!

กำเนิด TypeScript

TypeScript นั้นถูกสร้างโดย Microsoft หลังจากที่ VBScript ของตัวเองแพ้ให้กับ JavaScript

Microsoft ใช้หลักการว่า "ถ้าต้านไม่อยู่ ก็เข้าร่วมซะ" โดยมอบหมายงานนี้ให้กับ นักออกแบบภาษาโปรแกรมที่เคยออกแบบ C# และ .NET Framework มาแล้วอย่าง Anders Hejlsberg ซึ่งคอนเซ็ปที่เขาใช้ก็คือเพิ่ม Type ให้กับ JS ซะ

TypeScript = JavaScript + Type

แนวคิดนี้เหมือนกับตอนที่ C++ ถูกสร้างขึ้นมาคือเป็นการเพิ่มความสามารถให้ภาษา C อีกที (ในเวอร์ชันแรก C++ นั้นคอมไพล์ออกมาเป็นโค้ดภาษา C)

ครั้งนี้ก็เช่นกัน ภาษาใหม่ที่ออกแบบจะไม่ฉีกแนวไปจาก JavaScript เลย แต่เพิ่ม syntax ที่บวกความสามารถเรื่อง Type และอื่นๆ เข้าไปแทน โดยตัว TypeScript นี้ไม่ใช่ภาษาที่เอาไปรันได้ แต่ตัวมันคอมไพล์แล้ว output ออกมาเป็น JavaScript นั้นเอง

จริงๆ ต้องบอกว่า Alternative Language หรือภาษาที่เอามาเขียนแทน JavaScript ได้นั้นมีเยอะมาก เช่น CoffeeScript หรือภาษา Functional อย่าง Clojure

แต่ทำไมอยู่ๆ TypeScript ถึงดังขึ้นมาล่ะ? ทั้งที่ตอนนั้นกระแสโปรแกรมเมอร์ไม่ชอบ Microsoft เยอะมาก (ย้อนกลับไปช่วงต้นปี 2010 นะ) อะไรที่ Microsoft ทำในช่วงนั้น คนจะหนีกันหมด

จริงๆ แล้วตอนแรก TypeScript ก็ไม่ได้รับความนิยมอะไรมากหรอก

จน Google มีโปรเจคสร้างเฟรมเวิร์คสำหรับเขียน Frontend ตัวใหม่ที่ชื่อว่า AngularJS ออกมานั่นแหละ

ตอนนั้น AngularJS กำลังอยู่ในเวอร์ชัน 1 (เขียนด้วย JavaScript เพียวๆ เลย) และทาง Google ก็พบปัญหามากมาย จนอยากจะรื้อเขียนใหม่ให้เป็นเวอร์ชัน 2 ซะ แล้วไหนๆ ก็จะเขียนใหม่แล้ว เขียนมันด้วย ES6 เลยดีกว่า! (ในปีนั้นมาตราฐาน ES6 ยังไม่ออก) จะรอให้มาตราฐานออก ก็ไม่รู้ว่าจะมาเมื่อไหร่ งั้นก็ลองไปค้นๆ ในตลอดดูซิว่าตอนนี้มีภาษาอะไรเอามาใช้แทนก่อนได้มั้ย?

และหวยก็ไปออกที่ TypeScript นั่นเอง !!

คือตอนนั้นทีม Angular สร้างภาษาของตัวเองชื่อ ATScript ขึ้นมาเพื่อครอบ TypeScript อีกที แต่ก็เปลี่ยนใจยกเลิกไป แล้วหันมาใช้ TypeScript เพียวๆ แทน

และเมื่อ Angular ดังขึ้น --> TypeScript ก็เลยดังขึ้นมาพร้อมๆ กัน

สรุป

TypeScript เป็นแค่ภาษาที่เพิ่ม Type เข้ามาให้ภาษา JavaScript ซึ่งก็อาจจะถือว่าเป็นภาษาดวงดี ออกมาถูกจังหวะ จนทุกวันนี้ได้รับความนิยมสูงมาก โปรเจคใหญ่ๆ ไม่ว่าจะเป็น Node.js, React, Vue.js ล้วนแต่เอา TypeScript ไปผสมได้ทั้งนั้น (ถ้าเป็น Deno, Angular นั้นซัพพอร์ท TypeScript ตั้งแต่แรกอยู่แล้ว)

บล็อกต่อไปเราจะสอนวิธีการเซ็ตโปรเจค TypeScript ในโปรเจค Node.js กัน