谷粒商城28 - 前端基础 ES6 模块化

模块化

模块化概念:

代码示例

hello.js 如下

//声明方法的时候, 直接导出 
// export const util = {
//     sum(a, b) {
//         return a + b;
//     }
// }

//导出对象
export default {
    sum(a, b) {
        return a + b;
    }
}
// export {util}

//`export`不仅可以导出对象，一切JS变量都可以导出。比如：基本类型变量、函数、数组、对象。

user.js 如下

var name = "jack"
var age = 21

function add(a,b){
    return a + b;
}
// 导出
export {name,age,add}

main.js 导入的代码如下 使用import 关键字 导入 对导入的 变量, 可以直接进行使用

// 由于导出的是对象, 可以任意起名字 ,例如此处为abc
import abc from "./hello.js"
import {name,add} from "./user.js"

//对导入的模块, 进行调用使用, 传入参数即可
abc.sum(1,2);
console.log(name);
add(1,3);