概要
importとexportがわからなかったので、少し試してみた。
実行方法
<script type="module">指定し、chromeで確認しました。
ファイルパスではできなかった為、サーバーで実行しました。
まとめ
- ブラケットは独自仕様で、Objectとは関係なかった。
- importは、最初に一回だけ呼ばれる
コード
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
document.body.innerHTML = 'START<br/>'
</script>
<script type="module" src="./app.js"></script>
</body>
</html>
app.js
document.body.innerHTML += '-S:app.js<br/>'
// 呼ぶだけ
import './module.js'
// default + 名前
import def, {
name,
name as alias,
} from './module.js'
// default + 全部
import def2, * as all from './module.js'
// 全部 + 名前はできない
console.log({
def,
def2,
all,
name,
alias,
// alias: aliasの短縮
})
document.body.innerHTML += '-E:app.js<br/>'
module.js
document.body.innerHTML += '--S: module<br/>'
let var1 = 3
export default 0
export let name = 1, name2 = 2
export {
var1 ,
var1 as alias,
}
document.body.innerHTML += '--E: module<br/>'
出力結果
START
--S: module
--E: module
-S:app.js
-E:app.js
nodejsの実行方法
設定が必要。引数を追加したり、拡張子を追加するとできるようです。
参考
import / export
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/import
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/export