js设计模式:外观模式

作用:

将复杂的功能封装成可以简单调用的方法,无需知道内部的具体逻辑,只需要知道怎么去使用

类似于一把枪,你可以不知道内部的枪机,击发机,复进簧,枪管,导气装置,弹夹是怎么合作配合完成发射和自动填弹,你只需要知道你扣动扳机就能完成这一系列复杂的操作,而那个扳机就是外观的一个接口

示例:

javascript 复制代码
        const wjt = {
            name:'王惊涛',
            code:()=>{
                console.log('会写代码')
            },
            game:()=>{
                console.log('会打游戏')
            },
            love:()=>{
                console.log('热爱美女')
            }
        }

        const sunwukong = {
            name:'孙悟空',
            change:()=>{
                console.log('72变化')
            },
            fly:()=>{
                console.log('腾云架雾')
            },
            immobilize:()=>{
                console.log('会定身术')
            }
        }

        const sunwutao = {
            name:'孙悟涛',
            code:()=>{
                wjt.code()
            },
            love:()=>{
                wjt.love()
            },
            change:()=>{
                sunwukong.change()
            },
            fly:()=>{
                sunwukong.fly()
            },
            immobilize:()=>{
                sunwukong.immobilize()
            },
        }

        sunwutao.love()
        sunwutao.immobilize()

相关推荐
Mapmost1 分钟前
【高斯泼溅】如何将“歪头”的3DGS模型精准“钉”在地图上,杜绝后续误差?
前端
JellyDDD3 分钟前
h5上传大文件可能会导致手机浏览器卡死,重新刷新的问题
javascript·上传文件
废春啊34 分钟前
前端工程化
运维·服务器·前端
爱上妖精的尾巴35 分钟前
6-9 WPS JS宏Map、 set、get、delete、clear()映射的添加、修改、删除
前端·wps·js宏·jsa
爱分享的鱼鱼1 小时前
对比理解 Vue 响应式 API:data(), ref、reactive、computed 与 watch 详解
前端·vue.js
JS_GGbond1 小时前
【性能优化】给Vue应用“瘦身”:让你的网页快如闪电的烹饪秘籍
前端·vue.js
T___T1 小时前
一个定时器,理清 JavaScript 里的 this
前端·javascript·面试
代码小学僧1 小时前
从 Arco Table 迁移到 VTable:VTable使用经验分享
前端·react.js·开源
微笑的曙光1 小时前
Vue3 环境搭建 5 步走(零基础友好)
前端
不知名用户来了1 小时前
基于vue3 封装的antdv/element-Plus 快速生成增删改查页面
前端