[TypeScript#2] การใช้งานคลาสใน TypeScript

1class Human {
2  // เกิดเป็นคนไม่มีชื่อได้ยังไง
3  name: string
4
5  // พารามิเตอร์ของ constructor ฟังก์ชันก็ต้องมีการระบุชนิดข้อมูลเช่นกัน
6  constructor(name: string) {
7    this.name = name
8  }
9}
10
11// ประกาศ somchai แบบนี้ TypeScript จะอนุมานได้ว่า
12// somchai มีชนิดข้อมูลเป็น Human โดยอาศัยดูจากค่าขวามือ
13const somchai = new Human('Somchai')
14// หรือ
15// บอกให้ชัดเจนไปเลยว่า somchai เป็น**คน**นะเออ
16const somchai: Human = new Human('Somchai')

1class Human {}
2
3class Woman extends Human {
4  constructor() {
5    // เมื่อคลาสลูกมี constructor อย่าลืมเรียก super นะครับ
6    super()
7  }
8}

1class Human {
2  // สมาชิกของคลาสตัวนี้ ไม่มีการระบุอะไรทั้งสิ้น จึงมีค่าเท่ากับ
3  // public name: string
4  // เมื่อเป็น public จึงสามารถเข้าถึงจากที่ไหนก็ได้
5  name: string
6
7  constructor(name: string) {
8    this.name = name
9  }
10
11  // เมธอดนี้ไม่ได้ระบุ Access Modifiers ใดๆ จึงมีค่าเท่ากับ
12  // public printName()
13  public printName() {
14    // name ซึ่งเป็น public เข้าถึงจากภายในคลาสเองก็ได้
15    connsole.log(this.name)
16  }
17}
18
19const somchai = new Human('Somchai')
20// เข้าถึงจากภายนอกคลาสก็ย่อมได้
21somchai.name = 'Somsree'

1class Human {
2  age: number
3
4  constructor(name: string) {
5    this.name = name
6  }
7}
8
9const somchai = new Human('Somchai')
10// จงย้อนวัยไป 99 ปี~~
11// อ้า ตีนกาข้าหายไปแล้ว ฟินฝุดๆ
12somchai.age = -99

1class Human {
2  // จงเป็น private เสียเถอะ
3  private age: number
4
5  constructor(name: string) {
6    this.name = name
7  }
8
9  // เปิดเมธอดนี้ให้คนภายนอกเข้าถึงเพื่อตั้งค่าอายุ
10  setAge(age: number) {
11    // เช็คอายุก่อน ถ้าน้อยกว่าเท่ากับศูนย์หรือเกินหนึ่งร้อย คุณไม่ได้ไปต่อครับ
12    if (age > 0 && age <= 100) this.age = age
13  }
14}
15
16const somchai = new Human('Somchai')
17// Error: อย่ามาโกงอายุนะสมชาย
18somchai.age = -99
19// อายุไม่มากกว่าศูนย์เป็นไปไม่ได้ แก้ไขไม่ได้ครับ
20somchai.setAge(-99)
21// เยี่ยมอายุถูกต้องแล้ว
22// แต่คุณชราภาพระดับสูงเลยหละ
23somchai.setAge(99)

1class Human {
2  protected name: string
3
4  constructor(name: string) {
5    this.name = name
6  }
7
8  printName() {
9    // เข้าถึงจากภายในคลาสเองก็ได้
10    console.log(this.name)
11  }
12}
13
14class Man {
15  constructor(name: string) {
16    super(name)
17  }
18
19  ordain() {
20    // เข้าถึงจากคลาสลูกก็ได้
21    console.log(`${this.name} has already been a Buddhist monk!`)
22  }
23}
24
25const somchai = new Man('Somchai')
26// แต่เข้าถึงจากภายนอกไม่ได้
27somchai.name

1class Human {
2  private name: string
3
4  constructor(name: string) {
5    // รับ name เข้ามาแล้วตั้งค่าให้ name ที่เป็นสมาชิกของคลาสนี้
6    this.name = name
7  }
8}

1class Human {
2  // มีค่าเท่ากับตัวอย่างบนครับ
3  constructor(private name: string) {}
4}

1class Human {
2  constructor(private name: string) {}
3}
4
5// somchai เป็นอ็อบเจ็กต์ที่ name เป็น Somchai
6const somchai = new Human('Somchai')
7// ส่วน name ของ somsree ก็คือ Somsree
8// name ทั้งสองไม่เกี่ยวข้องกันเลย
9// จึงกล่าวได้ว่า name เป็นคุณสมบัติของอ็อบเจ็กต์
10const somsree = new Human('Somsree')

1class Circle {
2  // ค่า PI ในทุกวงกลมเหมือนกันหมด
3  // เราจึงไม่ให้ค่านี้เป็นคุณสมบัติของอ็อบเจ็กต์
4  // แต่ให้เป็นคุณสมบัติของคลาสแทนเลย
5  static PI = 3.14
6}
7
8// เพราะมันเป็นคุณสมบัติของคลาส
9// เราจึงเข้าถึงได้โดยตรงจากคลาสโดยไม่ต้องผ่านการ new
10Circle.PI

1class Circle {
2  static PI = 3.14
3}
4
5// เราใช้ circle1: Circle เพื่อบอก TypeScript ว่า
6// circle1 ของเรามีชนิดข้อมูลเป็นอ็อบเจ็กต์ของคลาส Circle
7const circle1: Circle = new Circle()

1class Circle {
2  static PI = 3.14
3}
4
5// circleClass : Circle แบบนี้ผิด
6// เพราะเป็นการบอกว่า circleClass มีชนิดข้อมูลเป็๋นอ็อบเจ็กต์ของคลาส Circle
7const circleClass: Circle = Circle
8
9// ต้องทำแบบนี้ circleClass : typeof Circle
10// เป็นการบอกว่า circleClass ของเรามีชนิดข้อมูลเป็นคลาส Circle เองเลย
11const circleClass: typeof Circle = Circle

1class Human {
2  private age: number
3
4  setAge(age: number) {
5    if (age > 0 && age <= 100) this.age = age
6  }
7}
8
9const somchai = new Human()
10
11// ด้วยวิธีนี้เมื่อเราจะตั้งค่าอายุเราต้องใช้
12somchai.setAge(99)

1class Human {
2  private _age: number
3
4  get age(): number {
5    return this._age
6  }
7
8  set age(age: number) {
9    if (age > 0 && age <= 100) this.age = age
10  }
11}
12
13const somchai = new Human()
14// เรียกใช้จากชื่อได้โดยตรง
15somchai.age = 99
16somchai.age

1abstract class Account {
2  // ให้ตั้งค่าเงินในบัญชีเริ่มต้นผ่าน constructor
3  constructor(protected balance: number) {}
4
5  // การฝากเงินไม่มีเงื่อนไขและเหมือนกันทั้งสองประเภทบัญชี
6  // จึงแยกมาอยู่ในคลาสแม่
7  deposit(amount: number) {
8    this.balance += amount
9  }
10
11  // แต่การถอนเงินนั้นแตกต่างออกไปในสองประเภทบัญชี
12  // จึงเป็น abstract method รอคลาสลูกไปเพิ่มโค๊ด (implementation)
13  abstract withdraw(amount: number): void
14}
15
16class SavingsAccount extends Account {
17  constructor(balance: number) {
18    super(balance)
19  }
20
21  withdraw(amount: number): void {
22    // ถ้าถอนเงินออกไปแล้วบัญชีไม่ติดลบ จึงให้ถอนเงินได้
23    if (this.balance - amount >= 0) {
24      this.balance -= amount
25    }
26  }
27}
28
29class FixedDepositAccount extends Account {
30  private openDate: Date
31
32  constructor(balance: number) {
33    super(balance)
34    this.openDate = new Date()
35  }
36
37  withdraw(amount: number): void {
38    // ถ้าถอนเงินออกไปแล้วบัญชีติดลบ ไม่ต้องทำอะไร
39    if (this.balance - amount < 0) return
40    // ถ้าเปิดบัญชีไม่ครบ 6 เดือน ถอนไม่ได้เช่นกัน
41    if (new Date().getMonth() - this.openDate.getMonth() < 6) return
42
43    this.balance -= amount
44  }
45}