上节我们讲解了单例模式,这节我们将继续讲解工厂模式和迭代器模式

工厂模式:

工厂模式的目的是为了方便的创建对象(可以在不知道构造的情况下),通过静态方法来实现,在java或c#等静态编译语言中需要通过反射实现,而javascript这一切会很简单,利用索引访问方法特性,如Coffee[coffeeType]();

var Coffee = function (name,price) {
this.name = name;
this.price = price;
}
Coffee.createCoffee = function (coffeeType) {
if (typeof Coffee[coffeeType] != 'function') {
throw Error('没有此种类型咖啡');
}
return Coffee[coffeeType]();
}
Coffee.mocha = function () {
return new Coffee('MochaCoffee', 20);
}
Coffee.blue = function () {
return new Coffee('BlueCoffee', 30);
}
module.exports = Coffee;
var blueCoffee =   Coffee.createCoffee('blue');
console.log(blueCoffee.name === 'BlueCoffee');

通过静态方法创建各种类型coffee实现,然后在工厂方法(createCoffee)中通过索引调用相应的方法并返回对象,在代码编写过程中最重要的是将方法名和方法的实际含义关联起来,这样再创建时才可以正确快速的找到需要的类型。

装饰模式:

装饰模式是一种非常实用的模式,本质是一种对象的组合,手机话费构成是典型的装饰模式,话费一般由基础套餐(N个)和特色套餐(m个)构成,不做处理的情况下用户套餐可能需要n*m个对象才能描述,很显然没人会这样做,人们需要的是一个N+M的组合方式。

首先定义基础套餐类,基础套餐采用之前介绍的工厂模式创建,预置了几种套餐类型:

var BasePackage = function (price, description) {

    this.price = Number(price);
this.description = description; BasePackage.prototype.getDescription = function () {
return '您的套餐:' + this.description + '每月' + this.price;
}
} BasePackage.create = function (packageType) {
if (typeof BasePackage[packageType] != "function") {
throw Error('没有这样的套餐');
}
return BasePackage[packageType]();
} BasePackage.home = function () {
return new BasePackage('50', '基础套餐');
} BasePackage.business = function () {
return new BasePackage('100', '商务套餐');
} BasePackage.ultimate = function () {
return new BasePackage('150', '旗舰套餐');
}

接着创建特色套餐,同样采用工厂模式,也同样预置几种套餐类型

var FeaturePackage = function (price, description) {

    this.price = Number(price);
this.description = description;
} FeaturePackage.create = function (packageType) {
if (typeof FeaturePackage[packageType] != "function") {
throw Error('没有这样的套餐');
}
return FeaturePackage[packageType]();
} FeaturePackage.traffic = function () {
return new FeaturePackage('20', '流量套餐');
} FeaturePackage.sms = function () {
return new FeaturePackage('10', '短信套餐');
}

需要将特色套餐装饰到基础套餐类中从而实现各种套餐组合,在基础套餐类定义装饰方法:

BasePackage.prototype.decorate= function(decorate) {
var featurePackage = FeaturePackage.create(decorate);
this.price += featurePackage.price;
this.description += ' + ' + featurePackage.description;
}

最后在搭配套餐的时候只需要选择想要的基础套餐和特色套餐装饰起来即可:

var basePackage = BasePackage.create('home');
basePackage.decorate('sms');
console.log(basePackage.getDescription());

小结:

本节讲解了工厂和装饰模式,并将两种模式融合在一起组成了一个手机套餐实例,工厂模式可以代替new操作,而装饰模式可以将对象进行组合从而实现代码的复用。

javascript模式 (3)——工厂模式和装饰模式的更多相关文章

  1. JavaScript 三种工厂模式

    标签(空格分隔): JavaScript 简单工厂模式是工厂函数返回实例化对象或者对象,工厂函数作为一个方法. 工厂方法模式是工厂函数不作改变,将子类放在工厂原型中:工厂函数返回对应的实例化对象:re ...

  2. JavaScript面向对象OOM 2(JavaScript 创建对象的工厂模式和构造函数模式)

      在创建对象的时候,使用对象字面量和 new Object() 构造函数的方式创建一个对象是最简单最方便的方式.但是凡是处于初级阶段的事物都会不可避免的存在一个问题,没有普适性,意思就是说我要为世界 ...

  3. <JavaScript> 稳妥构造函数模式与工厂模式的区别

    稳妥构造函数模式的代码应该是这样的: function Person(name, age, job) { var o = new Object(); // private members var na ...

  4. Java中的GOF23(23中设计模式)--------- 工厂模式(Factory)

    Java中的GOF23(23中设计模式)--------- 工厂模式(Factory) 在给大家介绍工厂模式之前,我想和大家聊聊面向对象的那点事,在这里,引入三个概念. 开闭原则(Open Close ...

  5. Java设计模式之(工厂模式)--简单工厂模式--工厂方法模式--抽象工厂模式

    工厂模式: 工厂模式可以分为三类: 1)简单工厂模式(Simple Factory) 2)工厂方法模式(Factory Method) 3)抽象工厂模式(Abstract Factory) 简单工厂模 ...

  6. Java中设计模式之工厂模式-4

    一.工厂模式由来 1)还没有工厂时代:假如还没有工业革命,如果一个客户要一款宝马车,一般的做法是客户去创建一款宝马车,然后拿来用. 2)简单工厂模式:后来出现工业革命.用户不用去创建宝马车.因为客户有 ...

  7. JS 简单工厂模式,工厂模式(二)

    一.什么是工厂模式: 工厂模式就是用来创建对象的一种最常用的设计模式,我们不暴露创建对象的具体逻辑,而是将逻辑封装到一个函数中,那么,这个函数 就可以被视为一个工厂.那么,在实际项目中,我们是不是可以 ...

  8. .Net简单工厂模式,工厂模式,抽象工厂模式实例

    1.定义   简单工厂模式:是由一个工厂对象决定创建出哪一种产品类的实例.简单工厂模式是工厂模式家族中最简单实用的模式,可以理解为是不同工厂模式的一个特殊实现. 工厂模式:定义一个用于创建对象的接口, ...

  9. C#设计模式——简单工厂模式、工厂模式和抽象工厂模式

    一:简单工厂模式 1:描述:简单工厂模式是由一个工厂对象根据接收到的消息决定要创建哪一个类的对象事例. 2:优点:工厂类中有相关逻辑判断,可以根据需要动态创建相关的对象事例,而客户端只需要告诉工厂类创 ...

随机推荐

  1. Callable、Future、RunnableFuture、FutureTask的原理及应用

    1. Callable.Future.RunnableFuture.FutureTask的继承关系 在多线程编程中,我们一般通过一个实现了Runnable接口的对象来创建一个线程,这个线程在内部会执行 ...

  2. maven项目部署打包

    方法一.把maven依赖的jar包一起打包 http://maven.apache.org/plugins/maven-assembly-plugin/usage.html pom/build中加入以 ...

  3. CSS3的学习--实现瀑布流

    基于CSS3实现瀑布流,使用CSS3的CSS 多栏(Multi-column). 可以到github上下载源码 : https://github.com/CraryPrimitiveMan/water ...

  4. Unity3D Player角色移动控制脚本

    1. 简介 在Unity3D中,有多种方式可以改变物体的坐标,实现移动的目的,其本质是每帧修改物体的position.之前写过类似的文章,这次增加了平时常用API的脚本,每个脚本均手打测试可用. 2. ...

  5. ViewPager的缓存机制

    1.实现Viewpager的页面懒加载: 在某些情况下,例如使用ViewPager查看多张大图,此时多张图片不能一次性载入,只有在浏览该页面时才载入(或者预先载入下一页面)页面的具体内容. 2.可控V ...

  6. 轻松自动化---selenium-webdriver(python) (十二)

    本节重点: l 键盘按键用法 l 键盘组合键用法 l send_keys() 输入中文运行报错问题 键盘按键键用法: #coding=utf-8 from selenium import webdri ...

  7. Gradify - 提取图片颜色,创建响应式的 CSS渐变

    被请求的HTTP对象之间的延迟会有一个时间段,这个期间网页看起来不完整.Gradify 可以分析出图像中4个最常见的颜色,创建一个梯度(或纯色)作为图片占位符.Gradify 可以在在任何图像发现最突 ...

  8. 让你心动的 HTML5 & CSS3 效果【附源码下载】

    这里集合的这组 HTML5 & CSS3 效果,有的是网站开发中常用的.实用的功能,有的是先进的 Web 技术的应用演示.不管哪一种,这些案例中的技术都值得我们去探究和学习. 超炫的 HTML ...

  9. iOS_UIImge_Gif的展示

    github地址: https://github.com/mancongiOS/UIImage.git 方式一: 用动画展示 UIImageView *gifImageView = [[UIImage ...

  10. 在Mac下配置php开发环境:Apache+php+MySql

    /private/etc/apache2/httpd.conf 一.启动Apache sudo apachectl start sudo apachectl -v   可以查看到Apache的版本信息 ...