《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 相关文章推荐
excel操作之Add Data to a Spreadsheet Cell
Jun 12 Javascript
七夕情人节丘比特射箭小游戏
Aug 20 Javascript
AngularJs bootstrap详解及示例代码
Sep 01 Javascript
Bootstrap栅格系统的使用和理解2
Dec 14 Javascript
几种响应式文字详解
May 19 Javascript
jQuery Jsonp跨域模拟搜索引擎
Jun 17 jQuery
JavaScript面向对象精要(上部)
Sep 12 Javascript
jQuery读取本地的json文件(实例讲解)
Oct 31 jQuery
js 将canvas生成图片保存,或直接保存一张图片的实现方法
Jan 02 Javascript
vue中axios解决跨域问题和拦截器的使用方法
Mar 07 Javascript
js实现视图和数据双向绑定的方法分析
Feb 05 Javascript
浅谈vue权限管理实现及流程
Apr 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
php表单转换textarea换行符的方法
2010/09/10 PHP
php和jquery实现地图区域数据统计展示数据示例
2014/02/12 PHP
WordPress自定义时间显示格式
2015/03/27 PHP
thinkPHP+phpexcel实现excel报表输出功能示例
2017/06/06 PHP
微信接口生成带参数的二维码
2017/07/31 PHP
获得Javascript对象属性个数的示例代码
2013/11/21 Javascript
javascript if条件判断方法小结
2014/05/17 Javascript
禁用Enter键表单自动提交实现代码
2014/05/22 Javascript
JQuery中的事件及动画用法实例
2015/01/26 Javascript
基于jQuery实现仿百度首页换肤背景图片切换代码
2015/08/25 Javascript
webpack中引用jquery的简单实现
2016/06/08 Javascript
jQuery 遍历map()方法详解
2016/11/04 Javascript
AngularJS 表单验证手机号的实例(非必填)
2017/11/12 Javascript
详解如何优雅地在React项目中使用Redux
2017/12/28 Javascript
深入理解vue中slot与slot-scope的具体使用
2018/01/26 Javascript
微信小程序实现多选功能
2018/11/04 Javascript
vue页面加载时的进度条功能(实例代码)
2020/01/13 Javascript
vue setInterval 定时器失效的解决方式
2020/07/30 Javascript
通过高德地图API获得某条道路上的所有坐标用于描绘道路的方法
2020/08/24 Javascript
python中文乱码的解决方法
2013/11/04 Python
Python使用bs4获取58同城城市分类的方法
2015/07/08 Python
详谈python read readline readlines的区别
2017/09/22 Python
python模块之paramiko实例代码
2018/01/31 Python
Python爬虫之网页图片抓取的方法
2018/07/16 Python
对Python3中列表乘以某一个数的示例详解
2019/07/20 Python
python下载库的步骤方法
2019/10/12 Python
Python列表元素删除和remove()方法详解
2021/01/04 Python
中软国际Java程序员笔试题
2014/07/19 面试题
应届生文秘专业个人自荐信格式
2013/09/21 职场文书
论文评语大全
2014/04/29 职场文书
教师党的群众路线对照检查材料
2014/09/24 职场文书
商家认证委托书格式
2014/10/16 职场文书
2015商场元旦促销活动策划方案
2014/12/09 职场文书
保研推荐信范文
2015/03/25 职场文书
施工安全责任协议书
2016/03/23 职场文书
MySQL主从切换的超详细步骤
2022/06/28 MySQL