由于浏览器不支持module所以需要先安装webpack打包方可使用module
1.安装webpack
npm install webpack@2.4.1 -g
2.使用webpack打包js文件
webpack file1.js file2.js
这样js就可以使用webpack了,webpack有很多其它的用法,由于只是为了学习module语法所以不再介绍其它用法
1.导出变量
export var firstName='Michael';
export var lastName='Jackson';
export var year=1958;
使用并弹框:import {firstName, lastName, year} from './2.js';
alert(firstName);
2.导出函数或对象
export function multiply(x, y) {
return x * y;
};
export var foo = {
name:"foo"
}
使用并弹框:import {multiply} from './2.js';
alert(multiply(2,2));
3.使用as对导出函数重命名
functionv1(){...}
functionv2(){...}
export{
v1 as streamV1,
v2 as streamV2,
v2 as streamLatestVersion};
4.加载整个模块
2.js定义了两个方法
export function area(radius) {
return radius * radius;
}
export function circumference(radius) {
return 2 *radius;
}
使用并弹框:import * as circle from './2.js';
alert(circle.area(4));
5.使用export default命令(可以不使用{})
export default function(){
console.log('foo');
}
使用import customName from'./2.js';
customName(); // 'foo'
6.使用export default输出多个
var foo = {
name:"foo"
}
var bar = {
name:"bar"
}
function baz(){
var name = "baz"
console.log(name)
}
export default {
foo,
bar,
baz,
get() {
console.log("get")
}
}
使用import user from './2.js';
console.log(user.foo);
console.log(user.bar);
console.log(user.baz());
console.log(user.get());