export

export 文は、指定したファイル (またはモジュール) から関数、オブジェクト、プリミティブをエクスポートするために使用します。

構文

export { name1, name2, …, nameN };
export { variable1 as name1, variable2 as name2, …, nameN };
export let name1, name2, …, nameN; // var も使用可
export let name1 = …, name2 = …, …, nameN; // var, const も使用可

export default expression;
export default function (…) { … } // class, function* も使用可
export default function name1(…) { … } // class, function* も使用可
export { name1 as default, … };

export * from …;
export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;

nameN

(別のスクリプトで import を使用してインポートできるようにするため) エクスポートする識別子。

説明

2 種類のエクスポート方法があり、それぞれ上記の構文のひとつに対応します:

• 名前付きエクスポート:

  export { myFunction }; // 前に宣言した関数をエクスポート
  export const foo = Math.sqrt(2); // 定数をエクスポート

• デフォルトエクスポート (スクリプトごとに 1 つに限る):

  export default function() {} // または 'export default class {}'
  // ここにはセミコロンを置きません

名前付きエクスポートは、さまざまな値をエクスポートするのに役立ちます。インポートするときに、対応する値を参照する名前を使用できます。

デフォルトエクスポートについては、モジュールごとにひとつだけです。関数、クラス、オブジェクトなどをデフォルトエクスポートすることができます。これはもっとも単純にインポートできますので、"主要な" エクスポート値であると考えられます。

例

名前付きエクスポートを使用する

モジュール側で以下のコードを使用します:

// module "my-module.js"
function cube(x) {
  return x * x * x;
}
const foo = Math.PI + Math.SQRT2;
export { cube, foo };

この方法では、別のスクリプト (import を参照) で以下のように使用できます:

import { cube, foo } from 'my-module';
console.log(cube(3)); // 27
console.log(foo);    // 4.555806215962888

デフォルトエクスポートを使用する

値をひとつエクスポートしたい、あるいはモジュールでフォールバック先の値を持ちたい場合は、デフォルトエクスポートを使用するとよいでしょう:

// module "my-module.js"
export default function cube(x) {
  return x * x * x;
}

別のスクリプトでは、デフォルトエクスポートのインポートは簡単です:

// module "my-module.js"
import cube from 'my-module';
console.log(cube(3)); // 27

仕様

ブラウザ実装状況

関連情報

• import
• ES6 in Depth: Modules, Hacks blog post by Jason Orendorff
• Axel Rauschmayer's book: "Exploring JS: Modules"