[解決済み】ES6での`export const`と`export default`の比較

質問

でインポートできること以外に、大きな違いがあるかどうかを判断しようとしています。 export default を行うだけで

import myItem from 'myItem';

そして export const できるんです。

import { myItem } from 'myItem';

これ以外の違いや使用例はありますか？

どのように解決するのですか？

名前付きエクスポートとデフォルトエクスポートの違いです。 export const は、const 宣言または宣言をエクスポートする名前付きエクスポートです。

強調したいのは、ここで重要なのは export というキーワードを const は、const 宣言や宣言を行う際に使用します。 export は、クラス宣言や関数宣言など、他の宣言にも適用されることがあります。

デフォルトのエクスポート ( export default )

デフォルトのエクスポートは1ファイルにつき1回までです。インポートするときは、このように名前を指定してインポートする必要があります。

import MyDefaultExport from "./MyFileWithADefaultExport";

好きな名前をつけてください。

名前付きエクスポート ( export )

名前付きエクスポートを使用すると、1つのファイルに複数の名前付きエクスポートを設定することができます。そして、中括弧で囲まれた必要な特定のエクスポートをインポートします。

// ex. importing multiple exports:
import { MyClass, MyOtherClass } from "./MyClass";
// ex. giving a named import a different name by using "as":
import { MyClass2 as MyClass2Alias } from "./MyClass2";

// use MyClass, MyOtherClass, and MyClass2Alias here

また、同じ文の中で、名前付きインポートと一緒にデフォルトを使用することも可能です。

import MyDefaultExport, { MyClass, MyOtherClass} from "./MyClass";

ネームスペースのインポート

また、ファイルから全てをオブジェクトにインポートすることも可能です。

import * as MyClasses from "./MyClass";
// use MyClasses.MyClass, MyClasses.MyOtherClass and MyClasses.default here

備考

• この構文は、デフォルトエクスポートの方がより一般的であるため、より簡潔であるとして好まれています ( 議論はこちら ).

• デフォルトのエクスポートは、実際には、名前付きエクスポートで default ということで、名前付きインポートでインポートできるようになっています。

  import { default as MyDefaultExport } from "./MyFileWithADefaultExport";