Trong TypeScript, bạn có thể chia nhỏ mã nguồn thành các module để quản lý tốt hơn và tránh xung đột tên. Mặc định, các lớp, hàm, hoặc biến được định nghĩa trong một module chỉ có thể truy cập trong module đó. Để cho phép các thành phần này (cụ thể là lớp) được truy cập từ bên ngoài, bạn cần sử dụng từ khóa export để xuất chúng ra ngoài.
Dưới đây là hướng dẫn chi tiết về cách thực hiện điều này.
exportĐể lớp có thể truy cập từ bên ngoài module, bạn chỉ cần thêm từ khóa export trước định nghĩa của lớp. Điều này cho phép lớp được xuất ra khỏi module và sử dụng ở nơi khác.
// file: Person.ts
export class Person {
private name: string;
constructor(name: string) {
this.name = name;
}
greet() {
return `Hello, my name is ${this.name}.`;
}
}Trong ví dụ trên, lớp Person đã được xuất bằng từ khóa export, điều này cho phép lớp này được sử dụng trong các file hoặc module khác.
Sau khi lớp đã được xuất, bạn có thể nhập (import) nó vào một module khác để sử dụng. Việc này được thực hiện bằng cách sử dụng cú pháp import.
// file: main.ts
import { Person } from './Person';
const person = new Person("John");
console.log(person.greet()); // Output: Hello, my name is John.Cú pháp import { Person } from './Person'; giúp nhập lớp Person từ module Person.ts vào module main.ts.
Bạn cũng có thể xuất nhiều lớp, hàm, hoặc biến từ cùng một module bằng cách sử dụng nhiều lệnh export hoặc một lệnh export duy nhất với nhiều thành phần.
// file: Utils.ts
export class Logger {
log(message: string) {
console.log(message);
}
}
export function add(a: number, b: number): number {
return a + b;
}Trong ví dụ này, cả lớp Logger và hàm add đều được xuất ra khỏi module Utils.ts. Bạn có thể nhập cả hai thành phần này từ module khác.
// file: app.ts
import { Logger, add } from './Utils';
const logger = new Logger();
logger.log("This is a log message.");
const result = add(3, 4);
console.log(result); // Output: 7Bạn cũng có thể xuất tất cả các thành phần trong một lần bằng cú pháp export duy nhất.
// file: Utils.ts
class Logger {
log(message: string) {
console.log(message);
}
}
function add(a: number, b: number): number {
return a + b;
}
export { Logger, add };Cú pháp export { Logger, add }; cho phép xuất cả lớp Logger và hàm add cùng lúc.
TypeScript cũng hỗ trợ xuất mặc định bằng cách sử dụng từ khóa export default. Khi sử dụng export mặc định, bạn không cần phải đặt tên cho lớp hay thành phần khi nhập, mà có thể đặt tên tùy ý.
// file: Car.ts
export default class Car {
private brand: string;
constructor(brand: string) {
this.brand = brand;
}
getBrand() {
return this.brand;
}
}Khi nhập một lớp hoặc hàm được xuất mặc định, bạn có thể sử dụng bất kỳ tên nào cho biến nhập.
// file: main.ts
import Car from './Car';
const myCar = new Car("Toyota");
console.log(myCar.getBrand()); // Output: ToyotaLưu ý rằng khi sử dụng export default, bạn chỉ có thể có một thành phần xuất mặc định trong mỗi module.
Ngoài việc xuất các lớp, hàm, hoặc biến từ chính module, bạn cũng có thể tái xuất (re-export) từ một module khác. Điều này rất hữu ích khi bạn muốn gộp các module hoặc tạo ra một module tổng hợp từ nhiều module con.
// file: index.ts
export { Person } from './Person';
export { Logger, add } from './Utils';Trong ví dụ trên, module index.ts tái xuất các thành phần từ các module khác. Bây giờ, bạn có thể nhập tất cả các thành phần này từ index.ts.
// file: app.ts
import { Person, Logger, add } from './index';
const person = new Person("Alice");
const logger = new Logger();
const result = add(5, 10);
logger.log(person.greet());
logger.log(`The result is: ${result}`);Kết luận, việc cho phép các lớp trong module truy cập từ bên ngoài đòi hỏi sử dụng từ khóa export để xuất các thành phần mong muốn. Bạn có thể xuất các lớp, hàm, hoặc biến một cách linh hoạt thông qua xuất riêng lẻ, xuất mặc định, hoặc tái xuất. Điều này giúp mã nguồn trở nên dễ quản lý và tái sử dụng hơn trong các dự án TypeScript lớn.
