Những ví dụ đơn giản sử dụng ES6 modules.

Trong tài liệu đặc tả ES6 mới, định nghĩa module và cách sử dụng module hiện là một phần của ngôn ngữ javascript. Trong bài viết này, tôi sẽ đưa ra một vài ví dụ đơn giản để mô tả cách sử dụng ES6 module.

Tương tự như Commonjs, ES6 cho phép ta export và import các object, nhưng cũng được thực hiện theo những cách hơi khác nhau một chút.

Ví dụ 1

Sử dụng export riêng lẻ ở cuối file module. Cách sử dụng này được gọi là "named export" do ta định nghĩa tên của object đang được export trong khi đang export.

// foobar.js

function foo() { return 'foo'; }
function bar() { return 'bar'; }
export { foo, bar };

Ta có thể sử dụng object được export từ các file khác như sau:

// main.js

import {foo, bar} from 'foobar';
foo();
bar();

import * as lib from 'foobar';
lib.foo();
lib.bar();

Ví dụ 2

Một format khác khi sử dụng "named export" là ta có thể export objects/function khi ta tạo ra chúng. Cấu trúc sau có phần tiện hơn so với ở ví dụ 1.

// foobar.js

export function foo() { return 'foo'; }
export function bar() { return 'bar'; }

Ví dụ 3

ES6 có một khái niệm là "default export". Một file có thể không có hoặc chỉ có 1 "default export". Đối với "named export", ta có thể sử dụng nhiều export trong một file.

// foobar.js

export default function foo() {
    return 'default foo';
}

export function bar() { return 'bar'; };

và đây là cách ta import

// main.js

// cách này cho phép ta chỉ import foo
import mylib from 'foobar';
import {default as mylib} from 'foobar';

// cách này cho phép ta import cả foo và bar
import mylib, {bar} from 'foobar';

Lưu ý rằng trong đoạn code trên, ta có thể sử dụng tên 'mylib' thay cho 'foo'. Bởi vì foo là 'default export' trong module của ta, nên ta không phải kéo nó ra khỏi object được exported theo cách ta làm nếu ta chỉ có "named export".

Source: Using es6 modules with simple examples - by Ryan http://javascript.tutorialhorizon.com/2015/06/23/es6-modules-examples/