示例
逻辑说明：
test4.html中引用了外部js文件 test4index.js
test4index.js 中调用了 test4util.js 中的模块（变量 函数 类）
HTML文件：test4.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="test4index.js" type="module"></script>
</head>
<body>
</body>
</html>
<script src="test4index.js" type="module"></script> 引入外部js时中一定要写 type="module" 否则会报错
js文件：test4index.js
//es6 中的模块 当前的模块中引入其他模块中的 变量 函数 类
//使用 import 引入其他模块导出的内容
import{stat,method1,method2,pointa} from './test4util.js'//引入test4util.js
//调用test4util.js中的 变量 函数 类
console.log(stat)
method1();
method2('我是一个路径');
let p=new pointa(1,2);
console.log(p.toString())
当前的模块中引入其他模块中的 变量 函数 类 使用 import 引入 其他模块导出的内容
引入起了别名的 变量 函数 类时，import中只能通过别名应用
import中引用别的js文件中的变量 函数 类时，也可以通过as关键字起别名 （import{method1 as 别名}）
js文件：test4util.js
//es6
//模块中可以定义变量 函数 类
let stat='test4util let stat';
function method1(){
console.log('test4util method1 空参方法');
}
function method2(src){
console.log('test4util method2 有参方法 src='+src);
}
class pointa{
constructor(x,y){
this.x=x;
this.y=y;
console.log('test4uti 有参构造方法');
}
toString(){
return '('+this.x+','+this.y+')';
}
}
//模块中定义的 变量 函数 类 都需要导出 (export)
export{stat,method1,method2,pointa}
模块中定义的 变量 函数 类 都需要 导出 (关键字export) 后才能被别的js文件引用
导出时可以起别名 用 as关键字 （exprot{stat as 别名}）这时，在别的js文件中引用时，只能通过别名进行引用
引入和导出所有内容可以使用 *作为通配符（import * export * ）
运行HTML文件后 控制台显示结果：
扩展
//输出一个快速的方法目录
export default function help(){
console.log('stat,method1,method2,pointa');
}
default关键字修饰的导出的内容，在import时，可以随便起名，不要求必须与export的名字一样（在一个js文件中，default关键字定义的属性，只能有一个）
import aaa from '路径';
aaa();
通过aaa引入help（）,调用aaa()相当于调用help();
776
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
