外观模式-前端设计模式

理解这个名字

外观模式, 又称为门面模式
比如说有一盘西瓜 一盘樱桃, 他们的分开来卖的话,不是很好, 如果他们放在一个盘子里装饰一下
是不是有一个很好的外观。

官方一点的话

外观模式为子系统中的一组接口提供了一个高层接口
使用者使用这个高层接口
这个高层接口相当于 下面的getInfo 函数

外观模式的设计原则验证

  • 不符合单一职责原则和开放封闭原则,使用时,需谨慎,不可以滥用
		function getName() {
            return 'zs'
        }
        function getAge() {
            return 18
        }
        let getInfo = function (a, b) {
            let info = a() + b()
            return info
        }
        console.log(getInfo(getName, getAge));

在写代码中大家都会使用一个外观模式
我写了一个class来实现这个

		var stopEvent = function( e ){  //同时阻止事件默认行为和冒泡
		 e.stopPropagation();
		 e.preventDefault();
		}

 		class E {
            stopPropagation() {
                console.log('阻止冒泡事件');
            }
            preventDefault() {
                console.log('阻止默认行为');
            }
        }

        var stopEvent = function (e) {  //同时阻止事件默认行为和冒泡
            e.stopPropagation();
            e.preventDefault();
        }
        stopEvent(new E())
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值