JavaScript设计模式之工厂模式简单实例教程

 更新时间:2018年07月03日 08:43:58   作者:CangoWu  
这篇文章主要介绍了JavaScript设计模式之工厂模式,结合完整实例形式分析了工厂模式的概念、原理及javascript定义与使用工厂模式的相关操作技巧,需要的朋友可以参考下

本文实例讲述了JavaScript设计模式之工厂模式。分享给大家供大家参考,具体如下:

一、工厂模式概念

工厂模式定义一个用于创建对象的接口,这个接口由子类决定实例化哪一个类。该模式使一个类的实例化延迟到了子类。而子类可以重写接口方法以便创建的时候指定自己的对象类型(抽象工厂)。

这个模式十分有用,尤其是创建对象的流程赋值的时候,比如依赖于很多设置文件等。并且,你会经常在程序里看到工厂方法,用于让子类定义需要创建的对象类型。

二、工厂模式的作用和注意事项

模式作用:

1、对象构建十分复杂--我们穿鞋很简单,但是制作鞋子的过程十分复杂

2、需要依赖具体的环境创建不同的实例--工厂可以做鞋子,做衣服,工厂可以做我需要的鞋子(鞋子不同),然后送到指定的地方(地方可以不同),可以理解为不同的实例

3、处理大量具有相同属性的小对象--比如买一双鞋,没必要找工厂生产

注意事项:

1、不能滥用工厂,有时候仅仅是给代码增加复杂度--如上3

三、工厂模式代码和实战总结

<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title>工厂模式</title>
</head>
<body>
<script>
 //1.工厂应该有厂长来决定运行到底哪条产品线
 //2.消费者-》子类
 var gongchang = {};
 gongchang.chanyifu = function(){
  this.gongren = 50;
  console.log("我们有"+this.gongren);
 }
 gongchang.chanxie = function(){
  this.gongren = 100;
  console.log("产鞋子");
 }
 gongchang.yunshu = function(){
  this.gongren = 10;
  console.log("运输");
 }
 gongchang.changzhang = function(para){
  return new gongchang[para]();
 }
 var we = gongchang.changzhang("chanyifu");
 var me = gongchang.changzhang("chanxie");
 console.log(me.gongren);
 var ys = gongchang.changzhang("yunshu");
 console.log(ys.gongren);
</script>
</body>
</html>

使用在线HTML/CSS/JavaScript代码运行工具 http://tools.jb51.net/code/HtmlJsRun测试运行效果如下:

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

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

相关文章

  • 常用限制input的方法的js代码

    常用限制input的方法的js代码

    常用限制input的方法的js代码...
    2007-03-03
  • javascript框架设计之浏览器的嗅探和特征侦测

    javascript框架设计之浏览器的嗅探和特征侦测

    这篇文章主要介绍了javascript框架设计之浏览器的嗅探和特征侦测的相关资料,需要的朋友可以参考下
    2015-06-06
  • 微信小程序通过一个json实现分享朋友圈图片

    微信小程序通过一个json实现分享朋友圈图片

    这篇文章主要给大家介绍了关于微信小程序通过一个json实现分享朋友圈图片的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用微信小程序具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-09-09
  • javascript实现base64 md5 sha1 密码加密

    javascript实现base64 md5 sha1 密码加密

    本篇文章给大家介绍了javascript实现密码加密,通过base64、md5、sha1文件,调用相关方法实现密码加密,非常简单,需要的朋友可以参考下
    2015-09-09
  • uni-app多环境配置实现自动部署的方式详解

    uni-app多环境配置实现自动部署的方式详解

    前后端分离开发模式中,无论前后端都有可能区分不同的环境配置,下面这篇文章主要给大家介绍了关于uni-app多环境配置实现自动部署的相关资料,需要的朋友可以参考下
    2022-06-06
  • 10道典型的JavaScript面试题

    10道典型的JavaScript面试题

    本文主要介绍了10道典型的JavaScript面试题。具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • JS+CSS相对定位实现的下拉菜单

    JS+CSS相对定位实现的下拉菜单

    这篇文章主要介绍了JS+CSS相对定位实现的下拉菜单,涉及JavaScript结合css的定位技术实现下拉菜单的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-10-10
  • 史上最为详细的javascript继承(推荐)

    史上最为详细的javascript继承(推荐)

    这篇文章主要介绍了javascript继承,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05
  • 详解将微信小程序接口Promise化并使用async函数

    详解将微信小程序接口Promise化并使用async函数

    这篇文章主要介绍了详解将微信小程序接口Promise化并使用async函数,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-08-08
  • JS实现电话号码的字母组合算法示例

    JS实现电话号码的字母组合算法示例

    这篇文章主要介绍了JS实现电话号码的字母组合算法,结合实例形式分析了javascript组合运算的相关算法原理与操作技巧,需要的朋友可以参考下
    2019-02-02

最新评论