首先這兩個是基于服務器端環境的 我這邊是安裝了phpstudy 安裝好之后會有一個www檔案夾 把內容放入該檔案夾中我的檔案夾叫exportandimport 里面有一個index.js 和一個index.html 可以啟動服務器 http://localhost/exportandimport
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="module">
/* 第一種情況:import {a} from './index.js'
console.log(a) */
/*第二種情況: import {a,b,c} from './index.js'
console.log(a)
console.log(b)
console.log(c) */
/*第三種情況函式的匯入: import {add} from './index.js'
console.log(add(1,2)) */
/*第四種不想暴露js中的變數名: import {x,y,z} from './index.js'
console.log(x)
console.log(y)
console.log(z) */
/*第五種聯合匯出1: import {a,add} from './index.js'
console.log(a)
console.log(add(1,2)) */
/* 第五種聯合匯出2: import {a,add} from './index.js'
console.log(a)
console.log(add(1,2)) */
/*第六種情況 export default : import a from './index.js'
console.log(a)
a可以使用別名b或者其他別名
import b from './index.js'
console.log(b) */
/* 第六種情況 export default復雜結構:import a from './index.js'
console.log(a.logo); */
/* 第七種方法：import {Person} from './index.js'
var p = new Person()
p.run()
import Person from './index.js'
var p = new Person()
p.run()*/
/*第八種方法： import * as aaa from './index.js'
console.log(aaa.flag)
console.log(aaa.name) */
</script>
</body>
</html>
js檔案
/*第一種情況 export let a = 'Lee'; */
/*第二種情況 var a ='Lee';var b ='李';var c = 'web';
export {a,b,c} */
/*第三種情況函式的匯出 export function add(a,b){
return a+b;
} */
/* 第四種不想暴露js中的變數名 var a ='Lee';var b ='李';var c = 'web';
export {
a as x,
b as y,
c as z
} */
/*第五種聯合匯出1 export var a ='Lee';
export function add(a,b){
return a+b;
} */
/*第五種聯合匯出2 var a ='Lee';
function add(a,b){
return a+b;
}
export {a,add} */
/* 第六種情況 export default :
var a = 'Lee';
export default a; */
/*第六種情況復雜結構 export default {
logo: 'UNI-ADMIN',
navBar: {
active: '0',
list: [{
name: "首頁",
subActive: '0',
submenu: [{
icon: "el-icon-s-home",
name: "后臺首頁",
pathname:"index"
},
{
icon: "el-icon-picture",
name: "相冊管理",
pathname:"image"
},
{
icon: "el-icon-s-claim",
name: "商品串列",
pathname:"shop_goods_list"
}
]
},
{
name: "商品",
subActive: '0',
submenu: [{
icon: "el-icon-s-claim",
name: "商品串列",
pathname:"shop_goods_list"
}]
},
{
name: "訂單"
},
{
name: "會員"
},
{
name: "設定"
},
]
}
} */
/*第七種方法： export class Person{
run(){
console.log("奔跑");
}
}
class Person{
run(){
console.log("奔跑");
}
}
export default Person
*/
/* 第八種方法： let name = '小明'
var flag = true
export {
flag,name
} */轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/306443.html
標籤：其他
上一篇：學習Vue看這個就夠了(下)