import によるインポート
CoddyのJavaScriptジャーニー「オブジェクト指向プログラミング」セクションの一部 — レッスン 9/56。
モジュールから機能をエクスポートした後、別のファイルで使用するために、それをインポートする必要があります。import ステートメントを使用すると、他のモジュールからエクスポートされた値を取り込むことができます。
名前付きエクスポートをインポートする:
// モジュールから特定の関数をインポートする
import { greet } from './greeting.js';
// これで greet 関数を使用できます
greet('John'); // 出力: Hello, John!複数の名前付きエクスポートを一度にインポートできます：
// 複数のエクスポートをインポートする
import { greet, farewell } from './greeting.js';
greet('John'); // 出力: Hello, John!
farewell('John'); // 出力: Goodbye, John!デフォルトのエクスポートをインポートする:
// デフォルトのエクスポートをインポートする（波括弧は不要）
// 他のファイルに export default functionName がある場合に使用します
import Person from './person.js';
// 新しい Person を作成する
const john = new Person('John');
チャレンジ
簡単サインアップフォームを作成しています。便利なメールバリデーション関数が含まれている validation-utils.js というファイルがあります。
タスク：
main.js内でvalidateEmail関数をインポートしてください（これは名前付きエクスポートであり、デフォルトエクスポートではありません）。- 関数を呼び出し、メールアドレス user@example.com を渡してください。
console.logを使用して結果を出力してください。
チートシート
他のモジュールからエクスポートされた値を取り込むには、import ステートメントを使用します。
名前付きエクスポートをインポートする:
import { greet } from './greeting.js';
greet('John'); // 出力: Hello, John!複数の名前付きエクスポートをインポートする:
import { greet, farewell } from './greeting.js';
greet('John'); // 出力: Hello, John!
farewell('John'); // 出力: Goodbye, John!デフォルトエクスポートをインポートする（波括弧は不要です）:
import Person from './person.js';
const john = new Person('John');自分で試してみよう
// TODO: ここで validateEmail 関数をインポートしてください（これは名前付きエクスポートです）
// TODO: 関数を呼び出して user@example.com というメールアドレスを渡し、console.log を使用して結果を出力してください
腕試しこのレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。
