Javascript教程第十五章:模块化编程--工程化的重要一步
Javascript教程第十五章:模块化编程--工程化的重要一步
类的内部操作实际上就是原型操作 类语法糖本质上就是上面提到的构造函数,constructor是函数的特殊值,方法会自动添加到构造函数的原型当中
一.模块化编程
1.开发一个模块管理引擎
let myModule = (function(){
    //定义容器存储模块
    const moduleList = {};
    function define(name,modules,action){
        //定义模块依赖功能
        modules.map((m,i) => {
            modules[i] = moduleList[m]
        })
        moduleList[name] = action.apply(null,modules)
    }
    return {define}
})()
myModule.define("hd",[],function(){
    return {
        first(arry){
            return array[0]
        },
        max(array,key){
            return array.sort((a,b) => (b[key] - a[key]))[0];
        }
    }
})
myModule.define("lesson",["hd"],function(hd){
    let data = [
        {name : "js",price : 99},
        {name : "css", price : 108}
    ]
    console.log(hd.max(data,"price"));
})
2.模块的基本使用
<script type="module">
    import {Tools} from "./myUser.js"
    console.log(Tools);
</script>
3.模块延迟解析和严格模式
模块是默认最后加载的,并且默认在严格模式下
4.模块预解析的必要性
模块只会在第一次导入的时候进行调用,预解析一次,避免当多个模块导入的时候来重复操作该模块的数据或者功能
5.按需动态加载模块
使用场景:当我们点击"继续加载"时向列表追加十篇文章,或者点击提交时导入模块