摘要：概念模式为更大的代码提供了一个方便的高层次接口，能够隐藏其底层的真是复杂性。参考设计模式设计模式系列文章设计模式之模块模式揭示模块模式设计模式之单例模式设计模式之外观模式
概念
Facade模式为更大的代码提供了一个方便的高层次接口，能够隐藏其底层的真是复杂性。
可以把它想成是简化API来展示给其他开发人员。
优点
简化接口
使用者与代码解耦
易于使用
缺点
存在隐性成本，性能相对差一些
应用栗子1
jquery框架中的$(el),对外提供一个简单接口，实现各种元素的选取，用户不必手动调用框架内部的各种方法，使用简单，下面提供了简化了的jq DOM选取的实现。
jQuery = function( selector, context ) {
// The jQuery object is actually just the init constructor "enhanced"
return new jQuery.fn.init( selector, context, rootjQuery );
};
jQuery.fn = jQuery.prototype = {
init: function( selector, context, rootjQuery ) {
var match, elem;
// HANDLE: $(""), $(null), $(undefined), $(false)
if ( !selector ) {
return this;
}
// Handle HTML strings
if ( typeof selector === "string" ) {
...
} else if ( selector.nodeType ) {
...
} else if ( jQuery.isFunction( selector ) ) {
...
}
return jQuery.makeArray( selector, this );
//将一个 HTMLElements 集合转换成对应的数组对内和merge相同可以操作类数组
}
}
.css()同理
栗子2
这个例子是外观模式和模块模式的组合，对外提供一个更加简单的facade接口。
let module = (function() {
var _private = {
i: 5,
get: function() {
console.log("current value:" + this.i);
},
set: function(val) {
this.i = val;
},
run: function() {
console.log("running");
},
jump: function() {
console.log("jumping");
}
},
return {
facade: function(args) {
_private.set(args.val);
_private.get();
if(args.run) {
_private.run();
}
}
}
}());
module.facade({run: true, value: 10});
参考
《JavaScript设计模式》
JS设计模式系列文章JS设计模式之Module（模块）模式、Revealing Module（揭示模块）模式
JS设计模式之Singleton（单例）模式
JS设计模式之Facade（外观）模式
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/99835.html
摘要：外观模式在中常常用于解决浏览器兼容性问题。实现外观模式不仅简化类中的接口，而且对接口与调用者也进行了解耦。外观模式的优势是易于使用，而且本身也比较轻量级。 1. 简介 外观模式（Facade）为子系统中的一组接口提供了一个一致的界面，此模块定义了一个高层接口，这个接口值得这一子系统更加容易使用。外观模式在JS中常常用于解决浏览器兼容性问题。 2. 实现 外观模式不仅简化类中的接口，而且...
摘要：外观设计模式外部与一个子系统的通信必须通过一个统一的门面对象进行，这就是门面模式。此角色知晓相关的子系统的功能和责任。外观模式结构客户端正常调用方式外观模式调用方式实现未使用外观模式子系统类客户端调用使用外观模式子系统类同上外观类客户端调用 外观设计模式 外部与一个子系统的通信必须通过一个统一的门面(Facade)对象进行，这就是门面模式。外观模式为子系统提供了统一的界面, 屏蔽了子类...
摘要：没有任何意外，王小二的公司用来开发公司的主打产品。臃肿的着手开干吧小二打开熟悉的，找到提交订单模块的。要不再去请教下哥的烦恼小二找到哥，详细的描述了他的问题。 流行的MVC架构模式 如今的Web开发，各种框架风起云涌，势如破竹。 从国民第一的ThinkPhp到称霸全球的Laravel，这些框架有一个共同特征，都采用了MVC的架构模式。 showImg(https://segmentfa...
摘要：适配器是将接口转换为不同接口，而外观模式是提供一个统一的接口来简化接口。 外观模式（Facade Pattern）属于结构型模式的一种，为子系统中的一组接口提供一个统一的入口，它通过引入一个外观角色来简化客户端与子系统之间的交互... 概述 外观模式是一种使用频率非常高的结构型设计模式，当你要为一个复杂子系统提供一个简单接口时。子系统往往因为不断演化而变得越来越复杂。大多数模式使用时...
摘要：改变接口的新模式，为了简化接口这次带来的模式为外观模式，之所以这么称呼，因为它将一个或多个类复杂的一切都隐藏起来。 改变接口的新模式，为了简化接口 这次带来的模式为外观模式，之所以这么称呼，因为它将一个或多个类复杂的一切都隐藏起来。 我依旧举生活中例子，现在有些朋友家的液晶电视可能是大尺寸的，或者有用投影仪来看电视，打游戏的。有一天我想用家庭影院系统在家里看一次大片。 ...
阅读 2966·2021-08-03 14:05
阅读 2015·2019-08-29 15:35
阅读 545·2019-08-29 13:30
阅读 3059·2019-08-29 13:20
阅读 2396·2019-08-23 18:15
阅读 1697·2019-08-23 14:57
阅读 2085·2019-08-23 13:57
阅读 1177·2019-08-23 12:10
