原型模式
原型模式介绍
原型模式是指原型实例指向创建对象的种类,并通过拷贝这些原型创建新的对象,是一种用来创建对象的模式,也就是创建一个对象作为另一个对象的prototype属性
实现原型模式是在ECMAScript5中,提出的Object.create方法,使用现有的对象来提供新创建的对象的__proto__。
代码实现
var lynkCoPrototype = {
model: "领克",
getModel: function () {
console.log('车辆模具是:' + this.model);
}
};
var volvo = Object.create(lynkCoPrototype, {
model: {
value: "沃尔沃"
}
});
volvo.getModel();
适配器模式
适配器模式介绍
适配器模式(Adapter)是将一个类(对象)的接口(方法或属性)转化成客户希望的另外一个接口(方法或属性),适配器模式使得原本由于接口不兼容而不能一起工作的那些类(对象)可以一些工作。别称包装器(wrapper)。
代码实现
class GooleMap {
show() {
console.log('渲染谷歌地图')
}
}
class BaiduMap {
show() {
console.log('渲染百度地图')
}
}
function render(map) {
if (map.show instanceof Function) {
map.show()
}
}
render(new GooleMap()) // 渲染谷歌地图
render(new BaiduMap()) // 渲染百度地图
但是假如BaiduMap类的原型方法不叫show,而是叫display,这时候就可以使用适配器模式了,因为我们不能轻易的改变第三方的内容。在BaiduMap的基础上封装一层,对外暴露show方法。
class GooleMap {
show() {
console.log('渲染谷歌地图')
}
}
class BaiduMap {
display() {
console.log('渲染百度地图')
}
}
// 定义适配器类, 对BaiduMap类进行封装
class BaiduMapAdapter {
show() {
var baiduMap = new BaiduMap()
return baiduMap.display()
}
}
function render(map) {
if (map.show instanceof Function) {
map.show()
}
}
render(new GooleMap()) // 渲染谷歌地图
render(new BaiduMapAdapter()) // 渲染百度地图
小结
- 适配器模式主要解决两个接口之间不匹配的问题,不会改变原有的接口,而是由一个对象对另一个对象的包装。
- 适配器模式符合开放封闭原则
以上就是JavaScript设计模式之原型模式和适配器模式示例详解的详细内容,更多关于JavaScript 原型适配器模式的资料请关注编程网其它相关文章!