Nếu đã nghe qua về OOP, chắc hẳn tính đóng gói ( hay bao đóng, hay Encapsulation) không hẳn là một khái niệm gì xa lạ. Trong TypeScript cũng vậy, để thể hiện tính bao đóng, riêng tư, kiểm soát dữ liệu của các class thì TypeScript sử dụng các data modifier (private, public, private)

Bài viết này chúng ta sẽ cùng tìm hiểu về các khái niệm cơ bản, cách sử dụng của data modifier trên nhé

public

Về cơ bản, tất cả mọi thứ trong class đều là public và có thể truy cập, tiếp cận từ bất kỳ nơi nào. Các dữ liệu đó có thể truy cập hay ghi đè từ bất kỳ nơi nào trong code của mình

class Employee {
	companyInfo: string;
	public address: string;

	constructor (companyInfo: string, address: string) {
		this.companyInfo = companyInfo
		this.address = address
	};
}

let employee = new Employee('yeulaptrinh.vn', "Hanoi")

console.log(employee.companyInfo) // yeulaptrinh.vn
console.log(employee.address) // Hanoi

Khi không sử dụng các modifiers thì mặc định mọi thứ đều là public

private

private đảm bảo rằng các thuộc tính sử dụng nó chỉ được truy cập, sử dụng nội bên trong class đó , không thể truy cập từ bên ngoài

class Employee {
	companyInfo: string;
	private address: string;

	constructor (companyInfo: string, address: string) {
		this.companyInfo = companyInfo
		this.address = address
	};
}

let employee = new Employee('yeulaptrinh.vn', "Hanoi")

employee.address = 'yeulaptrinh academy' // Property 'address' is private and only accessible 
console.log(employee.companyInfo)
console.log(employee.address) // Property 'address' is private and only accessible within class 'Employee'

Khi ta cố ghi đè thuộc tính address của employee trong ví dụ trên, lỗi sẽ được thông báo ra, cơ chế của private đã ngăn chặn việc đó diễn ra

protect

cơ chế của protect tương tự như private, tuy nhiên các class khi kế thừa (extends) từ class chứa chúng thì có thể truy cập, sử dụng chúng.

class Person {
	name: string;
	protected age: number;

	constructor(name: string, age: number) {
		this.name = name;
		this.age = age;
	}
}


class Employee extends Person {
	companyInfo: string;

	constructor (name: string, age: number, companyInfo: string) {
		super(name, age)
		this.companyInfo = companyInfo
	};

}

let employee = new Employee('uncleBob', 24, "yeulaptrinh.vn")

console.log(employee.age) // Property 'age' is protected and only accessible within class 'Person' and its subclasses.

readonly

Tương tự như readonly chúng ta đã tìm hiểu ở phần về Interface. Các thuộc tính được gán với readonly thì có thể truy câp tương tự như public, tuy nhiên, giá trị của chúng thì không được phép thay đổi.

class Employee {
	readonly name: string;
	age: number;
	companyInfo: string;

	constructor (name: string, age: number, companyInfo: string) {
		this.name = name;
		this.age = age;
		this.companyInfo = companyInfo
	};

}

let employee = new Employee('uncleBob', 24, "yeulaptrinh.vn")

employee.age = 20 
employee.name = "Bobby" // Cannot assign to 'name' because it is a read-only property.

Summary

Như vậy là chúng ta đã tìm hiểu về Data modifiers trong TypeScript, hi vọng bài viết có ích với các bạn, các bạn cùng đọc nhiều bài viết của chúng mình hơn nữa trên page yeulaptrinh.vn nhé. Rất mong nhận được sự đóng góp của các bạn để chúng mình hoàn thiện bài viết hơn