Hi các bạn, chào mừng các bạn trở lại với series Học 15 phút mỗi ngày cùng yeulaptrinh.vn. Hôm nay chúng ta sẽ cùng tìm hiểu về các loại Type :Union, Any, Void, Never trong TypeScript, về ý nghĩa, cách sử dụng và ứng dụng nhé.
Nào chúng ta cùng bắt đầu thôi

Union

Trong TypeScript, một biến hoặc một tham số cho hàm (parameter for function) có thể có nhiều kiểu kết hợp nhau, chúng gọi là Union type, chúng ta cùng xem qua ví dụ sau nhé.

let Record: (Number| Boolean)

Record = 1
Record = "A" // error: Type 'string' is not assignable to type 'Number | Boolean'.
Record = true

let Result: string | string[]

Result = "Done"
Result = ["Done", "Failed", "Success"]
Result = [1,2,3] // error: Type 'number' is not assignable to type 'string'

Ở ví dụ trên, Record có thể nhận kiểu Number hoặc Boolean làm giá trị cho mình. Result thì có thể nhận String hoặc Array String làm giá trị cho mình

const Greeting = (people: string | number) => {
    if (typeof people === 'string') {
        return `hello ${people}!`
    } if (typeof people === "number") {
        return `welcome ${people} you guys to yeulaptrinh.vn`
    }
}

Greeting("Uncle Bob") // hello Uncle Bob!
Greeting(3) // welcome 3 you guys to yeulaptrinh.vn

Ở ví dụ trên, chúng ta có thể sử dụng cả String và Number làm parameter của hàm Greeting.

Trong bài trước chúng ta đã học về Enum, Union cũng có thể được sử dụng như Enum trong một số trường hợp để giúp code có thể ngắn hơn, dễ đọc hơn

enum Room {
    LIVING_ROOM = "LIVING_ROOM",
    BED_ROOM = "BED_ROOM",
    KITCHEN = "KITCHEN"
}


type UnionRoom = "LIVING_ROOM" | "BED_ROOM" | "KITCHEN"

const unionRoom: UnionRoom = "BED_ROOM"

console.log(unionRoom) // BED_ROOM

const unionRoom: UnionRoom = "BATH_ROOM" //err: Type '"BATH_ROOM"' is not assignable to type 'UnionRoom'

Chúng ta cùng xem sau khi compile thì chúng UnionRoom sẽ thành gì nhé

var unionRoom = "BED_ROOM";
console.log(unionRoom);

Vậy là sau khi compile, chúng sẽ được gán thẳng luôn giá trị vào biến, còn những phần không sử dụng đến thì chúng sẽ xoá đi.

Any

Trong lúc code, hầu hết chúng ta đều handle hết những kiểu dữ liệu trả về, tuy nhiên trong một số trường hợp ngoại lệ, chúng ta không thể lường trước được kiểu trả về, đó chính là lý do any xuất hiện.
Đúng như tên của nó, type any chính là bất cứ thứ gì, kiểu gì cũng hợp lệ hết

any có thể coi là một sự “phóng thoáng” trong cách viết mà TypeScript kế thừa từ JavaScript

let Parameter: any 
Parameter = 1
Parameter = true
Parameter = "yeulaptrinh.vn"
Parameter = Error
Parameter = [10, "Class", 11, true]

Tương tự với Array, nếu như dùng kiểu any, nó có thể chứa bất cứ thứ gì trong Array

let Parameter: any[]

Parameter = [10, "Class", 11, true]
Parameter.push(["Grade", 12]) //  [10, 'Class', 11, true, [ 'Grade', 12 ] ]

Khi compile sáng JS file chúng ta sẽ được

var Parameter;
Parameter = 1;
Parameter = true;
Parameter = "yeulaptrinh.vn";
Parameter = Error;
Parameter = [10, "Class", 11, true];


var Parameter;
Parameter = [10, "Class", 11, true];
Parameter.push(["Grade", 12]); //  [10, 'Class', 11, true, [ 'Grade', 12 ] ]

Vậy là sau khi compile sang JS, biến Parameter sẽ được chuyển thành biến var, có thể nhận bất cứ giá trị gì cũng như có thể ghi đè giá trị của nó.

Do sự “phóng thoáng” của nó mà chúng ta có thể sử dụng any để code TypeScript như JavaScript :3. Trừ những trường hợp bất khả kháng, chúng ta nên hạn chế sử dụng any mà thay vào đó hãy tìm type thích hợp cho biến chúng ta cần sử dụng.

Bài học hôm nay chúng ta dừng lại ở đây, hẹn gặp các bạn ở bài học tiếp theo nhé