js-面向对象-设计模式-外观模式

外观模式：就是为子系统中的一组接口提供一个公共接口，定义一个高层的接口

外观模式下，可以通过请求外观接口，达到请求访问子接口的目的，也可以选择跳过外观接口，访问子系统

<script>
        function start(){
            console.log("开始了")
        }
        function doing(){
            console.log("进行中")
        }
        function end (){
            console.log("结束了了")
        }
        //外观模式的封装
        function execute(){
            start();
            doing();
            end();
        }
        execute()
    </script>

比如一个div，很多地方都会控制这个div 的显示和隐藏，但是每次进行手写代码冗余特别严重，所以我们可以使用外观模式进行封装

    <script>
        var box = document.getElementById("box");
        function setState(){
             //外观模式的封装，将显示和隐藏封装起来
             return{
                 show : function(){
                    box.style.display = "block";
                 },
                 hide : function(){
                     box.style.display = "none";
                 }
             }
         }

        var changeState = setState();
        //changeState.show();
        changeState.hide();
    </script>