JavaScriptにおける「export default」とは何ですか?


モジュールは、関数、オブジェクト、クラス、または値の集合体を含むJavaScriptファイルです。他のファイルで再利用できるコードブロックを作成するために使用されます。モジュールは、他のファイルからインポートされることができます。

「export default」は、モジュール内で1つのデフォルトエクスポートを行うために使用されます。モジュールからデフォルトエクスポートされた要素は、インポートする際に名前を指定せずに利用することができます。

以下に、「export default」の使用例をいくつか示します。

例1: 関数のデフォルトエクスポート

// モジュール内の関数をデフォルトエクスポートする
export default function add(a, b) {
  return a + b;
}

例2: オブジェクトのデフォルトエクスポート

// モジュール内のオブジェクトをデフォルトエクスポートする
export default {
  name: "John",
  age: 30
};

例3: クラスのデフォルトエクスポート

// モジュール内のクラスをデフォルトエクスポートする
export default class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

他のファイルでこれらのモジュールを使用する場合、以下のようにインポートすることができます。

import myFunction from './myModule';
import myObject from './myModule';
import Person from './myModule';
console.log(myFunction(2, 3)); // 出力: 5
console.log(myObject.name); // 出力: "John"
const person = new Person("Alice", 25);
console.log(person.name); // 出力: "Alice"
console.log(person.age); // 出力: 25

このように、「export default」を使用することで、モジュールのデフォルトエクスポートを簡単に行うことができます。