《javascript设计模式》学习笔记五:Javascript面向对象程序设计工厂模式实例分析


Posted in Javascript onApril 08, 2020

本文实例讲述了Javascript面向对象程序设计工厂模式。分享给大家供大家参考,具体如下:

工厂模式和单例模式(https://3water.com/article/184230.htm)应该是设计模式中应用最多的模式了,工厂模式的定义:提供创建对象的接口(来自百度百科:http://baike.baidu.com/view/1306799.htm),意思就是根据领导(调用者)的指示(参数),生产相应的产品(对象)。

1.简单工厂模式

    简单工厂也就是按照上面的定义,根据不同的参数返回不同的结果。

//定义通用的对象类
  var car = function(){};
  //定义对象,对象内容省略,对象必须实现car定义的成员函数(yy一下车^_^)
  var benz = function(){};
  var bmw = function(){};
  var audi = function(){};

  //工厂方法
  var CarFactory = {
    createCar: function(brand){
       //private member of CarFactory
       var car;
       switch(brand){
        case 'benz':
          car = new benz();
          break;
        case 'bmw':
          car = new bmw();
          break;
        case 'audi':
          car = new audi();
          break;
        default:
          car = new bmw();
       }
       //可以不用理会下面这行代码,这里是为了确保所有的品牌汽车都实现了car类的方法
       Interface.ensureImplements(car, Car);
       //返回对象
       return car;
     }
};
//如果我们要获取一部汽车,只需要调用:
var mycar = CarFactory.createCar('bmw');
//不论是什么牌子的汽车,他应该都具有car的所有方法,因此即使不是同样的对象,我们可以“透明”的调用他的方法

2.工厂模式

工厂模式与简单工厂模式的区别在于工厂模式使用子类来创建对象,而不是一个独立的类

//创建一个通用的工厂
var factory = function(){};
factory.prototype = {
  sellcar: function(brand){
    var car = this.createCar(brand);
    return car;
  },
  createCar: function(){
    throw new Error('unsupported operation on an abstract class');
  }
}

//北汽集团
var BJfactory = function(){};
//继承自factory,请参考https://3water.com/article/184227.htm面向对象之二继承)
extend(BJfactory,factory);
//重写汽车方法
BJfactory.prototype.createCar = function(brand){
  var car;
  switch(brand){
   case 'bmw':
     car = new BJbmw();
     break;
   case 'benz':
     car = new BJbenz();
     break;
   case 'audi':
     car = new BJaudi();
     break;
   default:
     car = new BJbmw();
  }
  Interface.ensureImplements(car, Car);
  return car;
}
//上汽
var SHfactory = function();
extend(SHfactory, factory);
//形式同北汽
……

//这样一来,您在北京买车
var fac = new BJfactory();
//调用父类方法
var mycar = fac.sellcar('benz');
//在上海买车
fac = new SHfactory();
hercar = fac.sellcar('audi');
//注意标红的两行调用,调用者都是fac,其实是factory的两个不同子类,但是调用方法都一样,这就是工厂方法的使用

3.类比PHP(希望有助于理解1,2的内容,下面的类名只是实例,并非真实存在)

如果熟悉PHP的同学,也应该了解像PHP的数据库类一般也是工厂模式,形如:

$db = DataBase.getInstance('mysql');
//这里的$db其实是new Mysql(),而无论是class Mysql,还是class Oracle,还是class MSsql都实现了下面的connect,query方法

$db->connect();
$db->query($sql);

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
不错的JS中变量相关的细节分析
Aug 13 Javascript
javascript简易缓动插件(源码打包)
Feb 16 Javascript
验证控件与Button的OnClientClick事件详细解析
Dec 04 Javascript
浅谈jQuery中replace()方法
May 13 Javascript
jQuery实现的数值范围range2dslider选取插件特效多款代码分享
Aug 27 Javascript
如何用angularjs制作一个完整的表格
Jan 21 Javascript
解决ajax不能访问本地文件问题(利用js跨域原理)
Jan 24 Javascript
JS+DIV实现的卷帘效果示例
Mar 22 Javascript
基于layer.js实现收货地址弹框选择然后返回相应的地址信息
May 26 Javascript
vue.js 获取当前自定义属性值
Jun 01 Javascript
vue router 跳转后回到顶部的实例
Aug 31 Javascript
js实现小星星游戏
Mar 23 Javascript
vue实现表单未编辑或未保存离开弹窗提示功能
Apr 08 #Javascript
JS快速实现简单计算器
Apr 08 #Javascript
javascript中contains是否包含功能实现代码(扩展字符、数组、dom)
Apr 07 #Javascript
vue-cli3单页构建大型项目方案
Apr 07 #Javascript
在Chrome DevTools中调试JavaScript的实现
Apr 07 #Javascript
《javascript设计模式》学习笔记四:Javascript面向对象程序设计链式调用实例分析
Apr 07 #Javascript
详解vue中在循环中使用@mouseenter 和 @mouseleave事件闪烁问题解决方法
Apr 07 #Javascript
You might like
laravel 关联关系遍历数组的例子
2019/10/10 PHP
JavaScript获取XML数据附示例截图
2014/03/05 Javascript
单元选择合并变色示例代码
2014/05/26 Javascript
jQuery基础语法实例入门
2014/12/23 Javascript
node.js 和HTML5开发本地桌面应用程序
2016/12/13 Javascript
使用BootStrap实现标签切换原理解析
2017/03/14 Javascript
React Native之ListView实现九宫格效果的示例
2017/08/02 Javascript
jQuery Ajax 实现分页 kkpager插件实例代码
2017/08/10 jQuery
Angular5给组件本身的标签添加样式class的方法
2018/04/07 Javascript
vue.js中npm安装教程图解
2018/04/10 Javascript
详解js跨域请求的两种方式,支持post请求
2018/05/05 Javascript
解决angularjs WdatePicker ng-model的问题
2018/09/13 Javascript
微信小程序授权登录解决方案的代码实例(含未通过授权解决方案)
2019/05/10 Javascript
小程序websocket心跳库(websocket-heartbeat-miniprogram)
2020/02/23 Javascript
Vue Router的手写实现方法实现
2020/03/02 Javascript
Javascript幻灯片播放功能实现过程解析
2020/05/07 Javascript
vue中解决微信html5原生ios虚拟键返回不刷新问题
2020/10/20 Javascript
[02:24]DOTA2亚洲邀请赛 NAVI战队出场宣传片
2015/02/07 DOTA
Python中字符串的常见操作技巧总结
2016/07/28 Python
TensorFlow安装及jupyter notebook配置方法
2017/09/08 Python
Python实现简易版的Web服务器(推荐)
2018/01/29 Python
通过python扫描二维码/条形码并打印数据
2019/11/14 Python
python如何使用socketserver模块实现并发聊天
2019/12/14 Python
python中提高pip install速度
2020/02/14 Python
使用keras根据层名称来初始化网络
2020/05/21 Python
英国在线自行车商店:Evans Cycles
2016/09/26 全球购物
红色连衣裙精品店:Red Dress Boutique
2018/08/11 全球购物
Notino意大利:购买香水和化妆品
2018/11/14 全球购物
美国现代家具购物网站:LexMod
2019/01/09 全球购物
小学毕业家长寄语
2014/01/19 职场文书
教师专业自荐书范文
2014/02/10 职场文书
保密协议书范本
2014/04/22 职场文书
环保宣传标语
2014/06/12 职场文书
golang 实现Location跳转方式
2021/05/02 Golang
最新最全的手机号验证正则表达式
2022/02/24 Javascript
python微信智能AI机器人实现多种支付方式
2022/04/12 Python