投稿日:2024/11/23
更新日:2024/11/23
Javascript、Typescriptを書いているとよくモジュールという言葉を耳にしますが、これについて整理したのでそのアウトプットです。
厳密には以下の役割を果たすコードのまとまりになります。
api.js
はapi用の関数だけを提供し、ui.js
はユーザーインターフェース関連のコードを管理するみたいなutils.js
というモジュールに共通処理をまとめておくとかadd
という関数があっても、ファイルBのadd
とは衝突しない。概念的に見ると何言ってんだという感じかと思いますが、要はインポート、エクスポートされているファイルのことをモジュールっていうんだという理解で問題ないと思います。
ちなみにインポートもエクスポートもしていないファイルのことをスクリプトっていうそうです。
// エクスポート (関数や変数をモジュールとして外部に公開)
export function add(a, b) {
return a + b;
}
export function subtract(a, b) {
return a - b;
}
上記の機能を下記ファイルで使用します。
// インポート (モジュールを使う)
import { add, subtract } from './mathUtils.js';
const result1 = add(10, 5);
const result2 = subtract(10, 5);
console.log(`Add: ${result1}, Subtract: ${result2}`);
このように書いた時、calculation.tsはモジュールということになります。
1ファイル=1モジュールですが、1モジュールから複数エクスポートも可能な点は押さえておきたいですね。
文系でRails出身なので雰囲気で掴んでいましたが、この辺のワードを押さえておくと記事が理解しやすくなったり、学習速度が上がると思うのでその辺の基礎力あげていきたい、、