requireJs学习02模块

最新推荐文章于 2022-03-26 20:50:36 发布

扫地鼠Gordon

最新推荐文章于 2022-03-26 20:50:36 发布

阅读量103

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/qq_28137309/article/details/113094288

版权

javascript 专栏收录该内容

33 篇文章 2 订阅

订阅专栏

模块遵循设计模式规范中的“开闭原则”：对扩展(继承)开放，对修改关闭

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>02模块</title>
    <link rel="stylesheet" href="">
</head>
<body>
<script>
    /*
        模块
            设计模式规范：
                开闭原则：对扩展(继承)开放，对修改关闭
    */

    var infoObj = {
        name: "iwen",
        age: 20,
        sex: "男"
    }
    // 不至于挂载到全局
    console.log(infoObj.age);//20
    infoObj.age = 30;
    console.log(infoObj.age);//30
    //但是有个问题，违背设计模式中的开闭原则，会被修改


    // 作用域独立
    // 外部不能修改，采用立即执行（匿名）函数
    (function(){
        function userInfo(){
            var name = "iwen";
            var age = 20;
            //返回一个对象
            return {
                name: name,
                age: age
            }
        }
        console.log(userInfo().name);
        var info = userInfo()
        console.log(info.age);
    })();
    // 作用域是独立了（解决了会被修改的问题），但还有一个问题：userInfo只能在匿名函数内部才能使用，外部不能使用

    // 模块
    // 对外部开放，且不能随意修改
    var module = (function(){
        var hello = "hello";
        function userInfo(){
            var name = "iwen";
            var age = 20;
            //返回一个对象
            return {
                name: name,
                age: age
            }
        }

        return {
            userInfo: userInfo,
            hello: hello
        }
    })();
    // 调用模块
    console.log(module.hello);
    console.log(module.userInfo().name);
    console.log(module.userInfo().age);

</script>
</body>
</html>