【JavaScript】importで外部ファイル読み込み

JavaScript[ES6]では、import と export を使えるようになりました。

今回はES6に導入された import についてわかりやすく説明していきます。

import とは

ES6では、JavaScriptオブジェクトをモジュール化して管理することができます。
モジュール化を行うと、機能の再利用 、保守性 、変数名を被る問題を防ぐ ことに関してうまく利用することが可能です。

このように記述をします

import {モジュール名} from "インポート元"

基本的なimportの使い方

モジュールには defaultモジュール と namedモジュール があります。

namedモジュールのインポート

modulesというファイルから、ModuleAとModuleBの2つのモジュールをインポートする方法をnamedモジュールのインポートする方法です。

import {ModuleA,ModuleB}1 from "modules";

defaltモジュールのインポート

moduleというファイルから、derfaultモジュールをインポートする方法です。

import Default from "module";