#62 JavaScriptの学習 exportとimportの応用

JavaScript プログラミング

複数エクスポートしたい時に「export {定数など, 定数など, ・・・};」と記述しましょう。データが増えるほど管理が大変になります。場合によってはファイルを分けて管理しないといけませんね。そんな時はexportで出力してimportで読み込みます。エクスポートは「export default クラス名」と記述するとそのファイルで1つしかエクスポートできませんが、定数などのエクスポートや複数する場合も覚えましょう。

ファイル名 prac2.js

  1. class Human {
  2.     constructor(name) {
  3.         this.human_name = name;
  4.     }
  5.     info() {
  6.         console.log('わたしは' + this.human_name + 'です');
  7.     }
  8. }
  9. const pepole1 = new Human('たろう');
  10. const pepole2 = new Human('はなこ');
  11. export {pepole1, pepole2};

ファイル名 prac.js

  1. mport {pepole1, pepole2} from "./prac2.js";
  2. pepole1.info();
  3. //→わたしはたろうです
  4. pepole2.info();
  5. //→わたしははなこです

このようにエクスポートする記述は「default」を書かずに「export {定数など};」これでエクスポートできます。また、複数する場合は{定数など, 定数など, ・・・}このように記述すると複数出来ます。インポートする場合も同じです。

関連記事
JavaScriptのexportとimportの基本
絶対に解決したいJavaScriptのインポートエラー

コメント