【javascript】モジュールの使用

こちらの記事は以下の書籍を参考にアウトプットとして執筆しました。
入門JavaScriptプログラミング

Reactの勉強を指定いてimportとexportがよくわからなかったため

モジュールの場所を指定

importを使うときは、「何を」、「どこから」を指定する。

基本構文

import X from Y

項目	説明
X	インポートするもの
Y	モジュールの場所

例

import myFunc from './my_format.js'

参考：入門JavaScriptプログラミング

モジュールの場所とモジュールから何をインポートするかを指定するには文字リテラルを使う

以下は無効

const MyModule='./my.js'
import myFunc from MyModule;

ということでYのところは絶対に文字列

以下は同等

import myVal from './src/file'
import myVal from './src/file.js'

参考：入門JavaScriptプログラミング

Yのファイル拡張子を省略した場合

ファイル拡張子が着いていないパスは、index.jsを含んでいるディレクトリを表す。

// ./src/file.jsと ./src/file/indes.jsの両方と一致
import myVla from './src/file';

// ./src/file.jsのみと一致
import myVal from './src/file.js'

参考：入門JavaScriptプログラミング

まぁ絶対パスを書いていれば安心。

ここまでのまとめ

構文は上記
モジュールの場所は文字列で指定
場所は拡張子の省略もできるけど、普通に拡張子まで書いたほうが今は無難

モジュールから値をインポート

./src/exam/file.js

export default function exam(num){console.log(num)}

import A from './src/exam/file.js'

ここでは./src/exam/file.jsの関数をAという名前でインポートしている

デフォルトエクスポートは好きな名前でインポートできる。