Các kiểu dữ liệu trong TypeScript

Articles

Bài viết này giải thích các kiểu dữ liệu trong TypeScript.

YouTube Video

Các kiểu dữ liệu trong TypeScript

TypeScript cung cấp nhiều kiểu dữ liệu khác nhau. Điều này cho phép bạn xác định kiểu dữ liệu nghiêm ngặt cho biến, tham số hàm và giá trị trả về. Dưới đây là các kiểu dữ liệu chính và cách sử dụng chúng.

Các kiểu dữ liệu nguyên thủy

Kiểu number

1let age: number = 25;
2console.log(age);          // Outputs: 25
3console.log(typeof age);    // Outputs: number

number là một kiểu được sử dụng để xử lý các giá trị số, bao gồm số nguyên và số thập phân (số thực). Xử lý các giá trị vượt quá giới hạn nhất định sẽ cho kết quả là Infinity hoặc NaN (Không phải là số).

1// Decimal calculations
2console.log(0.1 + 0.2 === 0.3); // false
3console.log(0.1 + 0.2); // 0.30000000000000004
4
5// Calculations with large numbers
6console.log(9007199254740991 + 1); // correct value
7console.log(9007199254740991 + 2); // incorrect value

Trong TypeScript, các số được biểu diễn dưới dạng số dấu phẩy động. Điều này có thể dẫn đến một số không chính xác nhỏ trong kết quả tính toán.
Khi cần tính toán chính xác, chẳng hạn như các giá trị tài chính, cần tránh các lỗi làm tròn như vậy. Ví dụ, bạn có thể sử dụng BigInt hoặc toFixed(), hoặc điều chỉnh số chữ số thập phân bằng cách sử dụng các thư viện như decimal.js.

Kiểu string

Kiểu string xử lý dữ liệu dạng văn bản.

1let greeting: string = "Hello, TypeScript!";
2console.log(greeting);     // Outputs: Hello, TypeScript!
3console.log(typeof greeting);  // Outputs: string

Kiểu boolean (Kiểu logic)

Kiểu boolean chỉ có hai giá trị: true hoặc false.

1let isOpen: boolean = true;
2console.log(isOpen);       // Outputs: true
3console.log(typeof isOpen);    // Outputs: boolean

null và undefined

null đại diện cho 'giá trị không tồn tại', và undefined đại diện cho 'giá trị không xác định'.

1let emptyValue: null = null;
2let notDefined: undefined = undefined;
3
4console.log(emptyValue);       // Outputs: null
5console.log(typeof emptyValue);    // Outputs: object (JavaScript specification)
6
7console.log(notDefined);       // Outputs: undefined
8console.log(typeof notDefined);    // Outputs: undefined

Array

Trong TypeScript, bạn có thể xác định kiểu của phần tử mảng. number[] là một mảng các số, và string[] là một mảng các chuỗi.

1let numbers: number[] = [1, 2, 3, 4];
2console.log(numbers);        // Outputs: [1, 2, 3, 4]
3console.log(typeof numbers); // Outputs: object
4
5let words: string[] = ["TypeScript", "JavaScript"];
6console.log(words);          // Outputs: ["TypeScript", "JavaScript"]
7console.log(typeof words);   // Outputs: object

Tuple

Tuple là một mảng với các phần tử có kiểu dữ liệu khác nhau.

1let person: [string, number] = ["Alice", 30];
2console.log(person);         // Outputs: ["Alice", 30]
3console.log(typeof person);  // Outputs: object

Enum

enum định nghĩa một tập hợp các hằng số có tên.

1enum Color {
2    Red,
3    Green,
4    Blue
5}
6
7let favoriteColor: Color = Color.Green;
8console.log(favoriteColor);  // Outputs: 1 (Defaults start from 0)
9console.log(typeof favoriteColor); // Outputs: number

any

Kiểu any có thể chứa bất kỳ kiểu giá trị nào và được sử dụng khi bạn muốn vô hiệu hóa kiểm tra kiểu dữ liệu.

1let anything: any = "Hello";
2console.log(anything);       // Outputs: Hello
3console.log(typeof anything);    // Outputs: string
4
5anything = 42;
6console.log(anything);       // Outputs: 42
7console.log(typeof anything);    // Outputs: number

Kiểu Union

Sử dụng kiểu Union, bạn có thể định nghĩa các biến có thể chứa một trong nhiều kiểu dữ liệu.

1let identifier: number | string = "ID_12345";
2console.log(identifier);     // Outputs: ID_12345
3console.log(typeof identifier);  // Outputs: string
4
5identifier = 12345;
6console.log(identifier);     // Outputs: 12345
7console.log(typeof identifier);  // Outputs: number

Tóm tắt

number, string, boolean: Các kiểu dữ liệu cơ bản.
null, undefined: Các giá trị đặc biệt.
Mảng: Một mảng với chú giải kiểu dữ liệu.
Tuple: Một mảng với các phần tử có kiểu khác nhau.
enum: Một kiểu liệt kê.
any: Bất kỳ kiểu nào.
Union: Một biến có thể nhận một trong nhiều kiểu dữ liệu.

Bằng cách sử dụng các kiểu dữ liệu này, TypeScript tăng cường tính an toàn của kiểu, giúp dễ dàng ngăn chặn lỗi trong quá trình phát triển.

Các đối tượng bao bọc

Đối tượng Bao bọc trong TypeScript là các đối tượng được tự động tạo ra để xử lý các kiểu dữ liệu nguyên thủy như đối tượng. Các kiểu nguyên thủy cho phép các thao tác nhẹ và nhanh, trong khi các kiểu đối tượng có phương thức và thuộc tính, cho phép các thao tác phong phú hơn.

Trong JavaScript (và TypeScript), có các đối tượng bao bọc tương ứng với các kiểu nguyên thủy như string, number và boolean. Chúng được tạo ra bằng cách sử dụng các hàm khởi tạo gọi là String, Number và Boolean, tương ứng.

Dưới đây là các ví dụ về các đối tượng bao bọc.

Đối tượng String

Đối tượng String cung cấp các thuộc tính và phương thức cho chuỗi.

1let strPrimitive: string = "Hello, World!";
2let strObject: String = new String("Hello, World!");
3
4console.log(strPrimitive);         // Outputs: Hello, World!
5console.log(typeof strPrimitive);  // Outputs: string
6
7console.log(strObject);            // Outputs: [String: 'Hello, World!']
8console.log(typeof strObject);     // Outputs: object

Đặc điểm:

Khác với kiểu nguyên thủy string, đối tượng String được coi là object bởi typeof.
Các đối tượng bao bọc hữu ích khi xử lý chuỗi hoặc gọi các phương thức trên chúng.

Đối tượng Number

Đối tượng Number cung cấp các thuộc tính và phương thức cho số.

1let numPrimitive: number = 42;
2let numObject: Number = new Number(42);
3
4console.log(numPrimitive);         // Outputs: 42
5console.log(typeof numPrimitive);  // Outputs: number
6
7console.log(numObject);            // Outputs: [Number: 42]
8console.log(typeof numObject);     // Outputs: object

Đặc điểm:

Đối tượng Number, như là một đối tượng bao bọc cho số, bao gồm các phương thức cho các phép toán số học (ví dụ, toFixed).

Đối tượng Boolean

Đối tượng Boolean cung cấp các thuộc tính và phương thức cho giá trị boolean.

1let boolPrimitive: boolean = true;
2let boolObject: Boolean = new Boolean(true);
3
4console.log(boolPrimitive);        // Outputs: true
5console.log(typeof boolPrimitive); // Outputs: boolean
6
7console.log(boolObject);           // Outputs: [Boolean: true]
8console.log(typeof boolObject);    // Outputs: object

Đặc điểm:

Đối tượng Boolean là một đối tượng bao bọc cho kiểu nguyên thủy boolean và được coi là object.

Sự khác biệt giữa các đối tượng bao bọc và các kiểu nguyên thủy

Vì các đối tượng bao bọc được coi là đối tượng, có sự giảm nhỏ về hiệu suất, nhưng các thao tác chức năng hơn có thể thực hiện được nhờ các thuộc tính và phương thức được thêm vào. Hơn nữa, có sự khác biệt trong việc so sánh sử dụng == và ===.

1let numPrimitive: number = 123;
2let numObject: Number = new Number(123);
3
4console.log('==  : ', numPrimitive == numObject);  // Outputs: true (Value comparison)
5console.log('=== : ', numPrimitive === numObject); // Outputs: false (Due to differing types)

Đặc điểm:

== so sánh giá trị, trong khi === so sánh chặt chẽ bao gồm cả loại. === trả về false khi so sánh các đối tượng bao gói với các kiểu dữ liệu nguyên thủy.

Chuyển đổi kiểu dữ liệu

Trong TypeScript, việc quản lý đúng các chuyển đổi kiểu dữ liệu ngầm định và tường minh là rất quan trọng.

Chuyển đổi kiểu dữ liệu ngầm định

Trong TypeScript, nên tránh chuyển đổi kiểu dữ liệu ngầm định hết mức có thể để đảm bảo an toàn kiểu dữ liệu.

1const result: string = 5 + "5"; // "55" (the number is converted to a string)
2
3console.log(result);

Trong ví dụ này, số 5 được ngầm định chuyển đổi thành chuỗi, dẫn đến kết quả là chuỗi "55".

Chuyển đổi kiểu dữ liệu tường minh

Trong TypeScript, sử dụng chú thích kiểu hoặc các hàm chuyển đổi kiểu để thực hiện chuyển đổi kiểu dữ liệu một cách an toàn.

1const num: string = "123";
2const convertedNum: number = Number(num); // Converts "123" to the number 123
3
4console.log(typeof num);
5console.log(typeof convertedNum);

Trong ví dụ này, hàm Number() được sử dụng để tường minh chuyển đổi chuỗi "123" thành số 123.

Kiểm tra kiểu dữ liệu

Trong TypeScript, bạn có thể sử dụng toán tử typeof để kiểm tra kiểu dữ liệu của một biến.

 1// Output: The type of 42 is: number
 2console.log('The type of 42             is:', typeof 42);
 3
 4// Output: The type of 42 is: bigint
 5console.log('The type of 42n            is:', typeof 42n);
 6
 7// Output: The type of "hello" is: string
 8console.log('The type of "hello"        is:', typeof "hello");
 9
10// Output: The type of true is: boolean
11console.log('The type of true           is:', typeof true);
12
13// Output: The type of undefined is: undefined
14console.log('The type of undefined      is:', typeof undefined);
15
16// Output: The type of null is: object
17console.log('The type of null           is:', typeof null);
18
19// Output: The type of Symbol() is: symbol
20console.log('The type of Symbol()       is:', typeof Symbol());
21
22// Output: The type of {} is: object
23console.log('The type of {}             is:', typeof {});
24
25// Output: The type of function () {} is: function
26console.log('The type of function () {} is:', typeof function () {});

Trong TypeScript, bạn có thể sử dụng typeof để kiểm tra kiểu, nhưng để kiểm tra kiểu chính xác hơn, cũng nên sử dụng các toán tử instanceof hoặc is.

Tóm tắt

Các đối tượng bao gói được coi như các đối tượng vì chúng cung cấp các phương thức và thuộc tính bổ sung cho các kiểu dữ liệu nguyên thủy.
String, Number và Boolean là các ví dụ tiêu biểu của các đối tượng bao gói.
Không giống như các kiểu dữ liệu nguyên thủy, các đối tượng bao gói được nhận dạng là object bởi typeof.

Bạn có thể làm theo bài viết trên bằng cách sử dụng Visual Studio Code trên kênh YouTube của chúng tôi. Vui lòng ghé thăm kênh YouTube.

YouTube Video

Các kiến thức cơ bản về TypeScript Toán tử trong TypeScript