5 - Variable & Data Types

ประเภทข้อมูล และ การประกาศตัวแปรของ TypeScript มันเป็นยังไง ไหนเล่าให้ฟังหน่อย ?

ถ้าบอกว่าบทไหนสำคัญที่สุด คงไม่พ้นบทนี้แน่ ๆ เพราะ ถ้าหากใครเขียนมาก่อนซักภาษาแล้ว และ เข้าใจว่าใน TypeScript มันมี Data Types แบบไหนให้ใช้ และ ประกาศตัวแปรยังไง ก็แทบจะเอาไปเขียนต่อเองได้เลย เอาเป็นว่าไม่สาธยายให้มากความ ไปดูกันเลยฮะ !

ว่าด้วยเรื่อง Data Types กันก่อน

เพราะก่อนประกาศตัวแปรเพื่อชี้เป้าไปที่ข้อมูล เราต้องรู้จักกับประเภทของข้อมูลใน TypeScript ให้เข้าใจตรงกันเสียก่อนจริงไหมครับ ? ในส่วนของ TypeScript นั้น มี 3 อย่างที่เราจะต้องรู้เกี่ยวกับประเภทหลักของประเภทข้อมูลดังนี้

ประเภท Any เจ้าตัวนี้คือประเภทที่ใหญ่ที่สุด เรียกว่าเป็น Super Type สำหรับ Data Type ทุกตัว
ประเภท Built-in Types เป็นประเภทที่ติดมาให้กับตัวภาษาอยู่แล้ว เช่น number, string, void, boolean และก็พวก undefined
ประเภท User-defined Types หรือ ประเภทที่เราสร้างขึ้นมาเองจาก Class ต่าง ๆ รวมถึง Array, Enum และ interface ด้วยนะ

Built-in Types แต่ละตัวมันมีอะไรบ้าง ?

ต่อจากประเภทใหญ่แล้ว เรามาดูภายในประเภท Built-in กันบ้างดีกว่า ว่าเขาให้อะไรเรามาใช้บ้าง

ชื่อ Data type

Keyword ที่ใช้

คำอธิบายคร่าว ๆ

Number

number

ใช้สำหรับตัวเลข ซึ่งสามารถใช้ได้ทั้งตัวเลขจำนวนเต็ม และ ทศนิยม (เก็บในรูปแบบ 64-bit)

Boolean

boolean

ใช้สำหรับแทนข้อมูลด้านตรรกะเก็บเป็น true / false

String

string

ใช้ในการเก็บสายอักขระ (Sequence of Characters) หรือ ข้อความนั่นแหละ

Void

void

โดยปกติจะใช้ในฟังก์ชันที่ไม่มีการ return หรือ ส่งค่ากลับ

Null

null

ใช้สำหรับกรณีที่ object นั้น ๆ ไม่มีค่าใด ๆ

Undefined

undefined

เป็นการบอกว่าตัวแปรดังกล่าวยังไม่เคยถูก Initialized นั่นเอง

ดังนั้นที่เห็นคงไม่มีอะไรแปลกใจเท่าไหร่ แต่มือใหม่หลายคนอาจเจอ Null และ Undefined เยอะหน่อยจนเกิดความสับสนคิดว่าทั้งสองตัวนี้เหมือนกัน แต่เอาจริง ๆ แล้วไม่เหมือนกันนะ ! ให้ลองดูจากตัวอย่างนี้ที่แอดเปรมได้ทำไว้ให้ดูได้เลย

var myname: string;
console.log(myname) 
console.log(typeof(myname))
/* ผลลัพธ์ที่ได้
undefined
undefined
/*

var myname2: string = null;
console.log(myname2) 
console.log(typeof(myname2))
/* ผลลัพธ์ที่ได้
null
object
/*

console.log(null === undefined) 
console.log(null == undefined) 
console.log(null === null) 
/* ผลลัพธ์ที่ได้
false
true
true
/*

มาต่อด้วยเรื่องของการประกาศตัวแปรกันบ้างดีกว่า

การประกาศตัวแปรทุกคนก็รู้ว่าเป็นส่วนสำคัญในการกำหนดชื่อให้กับข้อมูล หรือ Object ต่าง ๆ ที่เราให้กำเนิดมันขึ้นมา ในการประกาศตัวแปรของ Type Script เราสามารถกำหนดได้หลากหลายรูปแบบมาก ๆ ตามลักษณะการใช้งาน ซึ่งทำได้หลัก ๆ ตาม Pattern ดังนี้เลย

รูปแบบที่ 1 ประกาศตัวแปร พร้อมทั้งประเภทข้อมูล และ กำหนดข้อมูลในคำสั่งเดียว

var [identifier] : [data-type] = value

รูปแบบที่ 2 ประกาศตัวแปร พร้อมทั้งประเภทข้อมูล แต่ยังไม่กำหนดข้อมูลให้กับตัวแปรในคำสั่งเดียว

var [identifier] : [data-type]

แน่นอนว่าผลลัพธ์ที่ได้ของคำสั่งนี้คือการกำหนดตัวแปรไว้ แต่จะเป็นรูปแบบ undefined นั่นเอง

รูปแบบที่ 3 ประกาศตัวแปร พร้อมกำหนดข้อมูล แต่ไม่ได้ทำการกำหนด Data Type ตรงนี้ตัวแปรจะถูกกำหนดประเภทตามข้อมูลที่เราใส่ไปนั่นเอง

var [identifier] = value

รูปแบบที่ 4 ประกาศแค่เพียงชื่อตัวแปรเปล่า ๆ ออกมา จะทำให้ Data Type ถูกกำหนดให้เป็ร undefined

var [identifier]

สร้างสรรค์เนื้อหาสุดเฟี้ยวฟ้าวโดย

🐲 Kittikorn Prasertsak (แอดเปรม) - CEO @ borntoDev Co., Ltd.

Previous4 - TypeScript Syntax Next6 - All in One Data Type

Last updated 3 years ago

Was this helpful?

var myname: string; console.log(myname) console.log(typeof(myname)) /* ผลลัพธ์ที่ได้ undefined undefined /* var myname2: string = null; console.log(myname2) console.log(typeof(myname2)) /* ผลลัพธ์ที่ได้ null object /* console.log(null === undefined) console.log(null == undefined) console.log(null === null) /* ผลลัพธ์ที่ได้ false true true /*