React ES6 Modules

Module

Module là một tính năng của JavaScript, nó cho phép chúng ta chia code của mình thành các file riêng biệt.

Điều này sẽ giúp cho chúng ta dễ bảo trì code hơn.

Module sẽ sử dụng các câu lệnh import và export.

Export

Chúng ta có thể export một function hoặc một biến từ bất kỳ file nào.

Chúng ta hãy tạo ra một file có tên là person.js, và viết code cho nó bằng những đoạn code mà chúng ta muốn export.

Có hai loại export là: export được đặt tên và export mặc định.

Export được đặt tên

Chúng ta có thể tạo ra các export được đặt tên theo hai cách. Export trên một dòng riêng lẻ, hoặc export tất cả ở cùng một chỗ phía dưới cùng.

Ví dụ sau sẽ định nghĩa export biến trên một dòng riêng lẻ:

person.js

Ví dụ sau sẽ định nghĩa export tất cả các biến ở cùng một chỗ phía dưới cùng:

person.js

Export mặc định

Chúng ta hãy tạo ra một file khác, có tên là message.js, và sử dụng nó để giải thích về export mặc định.

Lưu ý: Chúng ta chỉ có thể có một export mặc định trong một file.

Ví dụ: message.js

Import

Chúng ta có thể import các module vào một file theo hai cách, dựa trên cơ sở chúng là các export được đặt tên hay là các export mặc định.

Các export được đặt tên phải được destructure bằng cách sử dụng cặp dấu ngoặc nhọn. Các export mặc định thì không.

Ví dụ sau sẽ import các export được đặt tên từ tập tin person.js:

Ví dụ sau sẽ import một export mặc định từ tập tin message.js: