defaultの有無
export default で書き出した値は、中括弧なしでimport できる。
export で書き出した値は、中括弧ありでimport する。
そしてさらに少しややこしくなるが、export で書き出した値は { xxx as yyy } とすることで任意の変数名に変えることができる。
とのこと。
参考:ES2015のモジュール機能(import/export)
実際に動かしてみた
上記の参考とまんまだが、実際に動かしてみた。
export default "uchida hyakken";
export const firstNaMe = "hyakken";
export const lastName = "uchida";
import name, { firstNaMe, lastName } from "./export";
console.log("name", name); // name uchida hyakken
console.log("firstNaMe", firstNaMe); // firstNaMe hyakken
console.log("lastName", lastName); // lastName uchida
下に小さくあるconsole ボタンを押して見ていただければ成功していることが確認できる。
うん、動かすことで理解が深まった。
export / import を使いこなすことで、ファイル管理を楽にしていこう。