Các kiểu dữ liệu trong TypeScript mà bạn nên biết

586

Bài viết được sự cho phép của tác giả Thầy Long Web

Các kiểu dữ liệu trong TypeScript trình bày các kiểu dữ liệu dùng trong TypeScript, bao gồm các liểu dữ liệu cơ bản và các kiểu bổ sung.

Kiểu dữ liệu là gì?

Trong lập trình, rất cần có chỗ để lưu các giá trị dùng cho lưu trữ và xử lý. Mỗi nơi lưu trữ này là biến, hằng. Các giá trị trong biến, hằng được xác định thuộc loại nào đó để sử dụng đúng trong các toán tử xử lý. Ví dụ kiểu dữ liệu number (số), kiểu chuỗi (string),… Kiểu chuỗi thì có thể biến thành chữ hoa, kiểu số thì có thể dùng trong các toán tử ++, –…

TypeScript có nhiều kiểu dữ liệu phục vụ cho nhiều tính toán rất tốt như boolean, number, string, tuple, array, any… và nhiều kiểu nâng cao khác.

Khai báo biến trong typeScript

Để khai báo biến trong TypeScript, dùng từ khóa var , let hoặc const. Ví dụ

var tenbh = 'Hãy yêu nhau đi'; 
let namsangtac = 1970;
const tygia = 250000;

Trong typescript, khi khai báo biến sẽ tốt hơn nếu có khai báo luôn kiểu dữ liệu. Code như sau:

let tensach : string = "Hiểu về trái tim";
var gia:number = 150000;
const tenLoai:string = 'Điện thoại';

Không nhất thiết phải gán giá trị khi khai báo biến. Khai báo biến trước rồi gán giá trị cho nó sau đó cũng được.

let anhien : boolean;
let soluong:number;
anhien = true;
soluong = 5;

Kiểu boolean trong typescript

Kiểu boolean là kiểu dữ liệu chỉ có hai giá trị là truefalse. Nghĩa là biến nào được khai báo là boolean thì chỉ có thể gán vào đó 1 trong 2 giá trị là true hoặc false. Ví dụ:

let trangthai: boolean;
trangthai = false;
let diem = 7 ;
let ketquathi:boolean = diem>=5 ;

Các biến kiểu boolean thường được dùng trong các điều kiện (if) để xử lý, tính toán tùy theo giá trị true false.

Kiểu number trong typescript

Đây là kiểu số, bao gồm cả số nguyên và số thực. Có thể gán, thay đổi giá trị các biến kiểu số với các toán tử tăng, giảm, +, – , *, / , %

let gia:number = 150;
gia += 10;
gia= 150.5;

  Code ví dụ TypeScript, hướng dẫn tạo project TypeScript

  Học kiến thức căn bản TypeScript chỉ trong 30 phút

Kiểu string trong typescript

String là kiểu chuỗi. Khi 1 biến được khai báo là kiểu string thì có thể gán 1 chuỗi giá trị cho nó. Chuỗi giá trị này được bao quanh bởi dấu ” hoặc dấu ‘ hoặc dấu `

let tieuDe:string = 'Kệ Thị Tịch';
let tacGia:string ="Vạn Hạnh";
let noidung:string = `
   Thân như điện ảnh hữu hoàn vô
   Vạn mộc xuân vinh, thu hựu khô.
   Nhậm vận thịnh suy vô bố uý
   Thịnh suy như lộ thảo đầu phô.
`;

Kiểu array trong typescript

Biến nào thuộc kiểu array thì có thể chứa được nhiều giá trị trong đó. Các giá trị trong array thuộc cùng 1 kiểu (number, string…) .

Có 2 cách khai báo array trong typescript. Đó là sử dụng cú pháp type[] hoặc dùng Array<type>

Cách 1: khai báo mảng dùng kiểu type[]

let arr_sanpham: string[] = ['Chuối nướng', "Gạo ST25", `Kẹo mè`];
let arr_soluong: number[] = [5, 2, 1];

Cách 2: khai báo mảng dùng kiểu Array<type>

let arr_tp: Array<string> = ['TPHCM', 'Hà Nội', "Đà Nẵng", `Cần Thơ`];
let arr_sốdân: Array<number> = [8.9, 8.4 , 1.2 , 2.0]; //triệu

Kiểu tuple trong typescript

Kiểu dữ liệu tuple là 1 mảng cố định số phần tử mà mỗi phần tử có kiểu dữ liệu khác nhau. Ví dụ

let sp1: [string, number] = [‘Gạo ST25’, 27000];

Tham khảo việc làm Typescript hấp dẫn tại Topdev

Kiểu enum trong typescript

Enum là kiểu liệt kê. Bạn định nghĩa ra kiểu này với các thành viên được liệt kê tên ra. Giá trị (value) của từng thành viên tăng từ 0, 1, 2….

enum role {REGISTER, AUTHOR, EDITOR, ADMIN}; //0, 1 , 2 , 3
let r1: role = role.ADMIN; // 3
let r2: role = role.AUTHOR; // 1
console.log(r1, r2); // 1 3

Các thành viên trong enum có name và value. name thì phải khai báo như ví dụ trên, còn value nếu không chỉ định thì sẽ tăng 1 từ giá trị của thành viên trước đó. Giá trị của các thành viên có thể trùng nhau . Xem ví dụ sau:

enum MAVUNG {HCM=28, CAMAU, DANANG=36, CANTHO=36};  
let hcm = MAVUNG.HCM; //  28
let cm = MAVUNG.CAMAU; // 29
let ct = MAVUNG.CANTHO; // 36
console.log(hcm, cm, ct ); //28 29 36

Kiểu enum giúp viết code lập trình được tường minh hơn. Như trong ví dụ trên, ghi MAVUNG.HCM thì rõ ràng hơn là 28.

Kiểu boolean trong typescript cũng chính là kiểu enum, chỉ có 2 giá trị true, false.

Kiểu union trong typescript

Union là kết hợp nhiều kiểu dữ liệu với nhau, dùng union để chỉ định các loại dữ liệu có thể gán cho biến.

let ketquathi : string | boolean;
ketquathi = "Đậu";
ketquathi = true;
let arr_gia : string[]  |  number[];
arr_gia = ['15 $', '25000 VNĐ', '140000 đồng'];
arr_gia = [375000, 25000, 140000];

Kiểu object trong typescript

Kiểu object còn gọi là kiểu đối tượng, khai báo và sử dụng như các object javascript. Biến kiểu đối tượng được đặt trong dấu {}, các thành viên cách nhau bởi dấu phẩy. Từng thành viên là từng cặp name:value

const nhanvien1 = {
    hoten:"Nguyễn Văn Tèo",
    tuoi: 25,
    phones: ['0917438274','095632421']
}
let ht = nhanvien1.hoten;
console.log(ht);//Nguyễn Văn Tèo

Kiểu any trong typescript

any là kiểu dữ liệu cho phép bạn gán giá trị bất kì vào biến. Lúc thì gán số, lúc khác gán string đều được.

let ketqua: any = true; // kiểu boolean
ketqua = "Đậu"; //lúc khác gán kiểu chuỗi
ketqua = 9; // gán số đều ok
let sp1:any[] = [2, 'Corddoba Guitar Guclcor', true];

Nên hạn chế sử dụng any, vì khi đó TypeScript sẽ bỏ qua kiểm tra kiểu khi bạn tính toán, xử lý giá trị của biến này.

Kiểu unknown trong typescript

Kểu dữ liệu unkown tương tự như any. Bạn có thể gán giá trị bất kỳ cho biến kiểu này. Gán 1 biến unkown cho 1 biến có kiểu tường minh sẽ bị lỗi, còn any thì không.

let  un :unknown = 9; let a:number = un; //not ok
let an:any = 8; let b:number = an;  //ok

Để gán giá trị unknow cho biến khác, bạn cần xác định kiểu rõ ràng rồi mới gán

let  un :unknown = 9;
if (typeof un=='number'){
    let a:number = un; //ok
}

Phân biệt giá trị null và undefine của biến

Null

  • Có giá trị gán cho biến
  • Có thể gán cho biến không trỏ đến bất kỳ đối tượng nào
  • Typeof là object
  • Null có thể là rỗng hoặc không tồn tại
  • Sự vắng mặt của giá trị cho một biến
  • Null có thể được chuyển đổi thành 0
let a = null;
console.log(a); //null
console.log(typeof(a)); //object

Undefined

  • Không có giá trị gán cho biến
  • Biến đã được khai báo nhưng vẫn chưa gán giá trị
  • Typeof là undefined
  • Được dùng khi biến không được gán giá trị
  • Sự vắng mặt của biến đó
  • Có thể được chuyển đổi thành NaN
let x ;
console.log(x); //undefined
console.log(typeof(x)); //undefined
console.log(typeof(x1)); //undefined

Ép kiểu trong typescript

Ép kiểu tức thực hiện chuyển đổi kiểu dữ liệu của biến sang dạng khác để xử lý, tính toán với các toán tử phù hợp. Ví dụ chuyển đổi chuỗi ’12’ thành số 12…

Có 2 cách ép kiểu trong Typescript, cách 1 là dùng <type> còn cách 2 là dùng từ khóa as. Ví dụ:

let userInput:unknown = prompt("Mời nhập cái gì đó");
let sokytu: number = ( <string> userInput ).length;
console.log(sokytu);
let userInput:unknown = prompt("Mời nhập cái gì đó");
let sokytu: number = (userInput as string).length;
console.log(sokytu);

Tạo kiểu dữ liệu trong typescript

Với dữ liệu có cấu trúc phức tạp. Cần phải phối hợp các kiểu cơ bản lại để tạo nên 1 kiểu mới, mô tả chính cấu trúc của dữ liệu thì code sẽ trực quan hơn.  Để tạo type mới, dùng từ khóa type , sau đó là tên và {}

type chó = {
    ten: string ;
    namsinh: number ;
    màulông:string ;
    tênchủ:string ;
};

let c1:chó = { ten:"Nô nô", namsinh:2009, màulông:'Vàng', tênchủ:'Bá Chinh'}
let c2:chó = { ten:"Mập", namsinh:2021, màulông:'Mâu', tênchủ:'Thùy Dương' }

Tới đây, bài viết các kiểu dữ liệu trong TypeScript dừng nhé. Một vài thực tập bạn cũng đã thực hiện. Mệt chưa, nghỉ chút đi nhé 🙂

Bài viết gốc được đăng tải tại longnv.name.vn

Xem thêm:

Xem thêm Việc làm IT hấp dẫn trên TopDev