js设计模式:工厂模式、构造函数模式、原型模式、混合模式
var o1 = new Object();o1.name = "宾宾";o1.sex = "男";o1.age = "27";o1.msg = function(){console.log("姓名:"+this.name+" 性别:"+this.sex+" 年龄:"+this.age);}var o2 = new Object();o2.name = "倩倩";o2.sex = "女";o2.age = "20";o2.msg = function(){console.log("姓名:"+this.name+" 性别:"+this.sex+" 年龄:"+this.age);}//调用对象下面方法o1.msg();o2.msg();//思考:如何让代码复用。//为了解决这个,引用一种设计模式:工厂模式。就是在函数内部创建一个对象,给对象赋予属性和方法,在将对象返回即可。
//工厂模式是软件工程领域一种广为人知的设计模式,而由于在ECMAScript中无法创建类,因此用函数封装以特定接口创建对象。其实现方法非常简单,也就是在函数内创建一个对象,给对象赋予属性及方法再将对象返回即可。function Person(name,sex,age){var o = new Object();o.name = name;o.sex = sex;o.age = age;o.getName = function () {console.log(this.name);}o.msg = function(){console.log("姓名:"+this.name+" 性别:"+this.sex+" 年龄:"+this.age);}return o;}var person1 = Person("彬彬","男","26");//var myArray=new Array();var person2 = Person("倩倩","女","26");person1.msg();person1.getName();person2.msg();//思考:我们创建的对象和系统对象有什么区别??//为了解决这个:我们需要在外面new一个函数就可以了,这就引出了js另一种设计模式:构造函数模式
//此模式特点:当new去调用一个函数,这个时候函数里面的this就是创建出来的对象,而且函数返回值直接就是this,这就叫隐式返回function Person(name,sex,age){this.name = name;this.sex = sex;this.age = age;this.getName = function () {console.log(this.name);}this.msg = function(){console.log("姓名:"+this.name+" 性别:"+this.sex+" 年龄:"+this.age);}}var person1 = new Person("彬彬1","男","26");var person2 = new Person("倩倩1","女","26");person1.msg();person1.getName();person2.msg();console.log(person1.msg == person2.msg);//false//思考:如何在提供性能??也就是让公用的属性和方法在内存中只存在一份??//解决问题方法:这里用到js设计模式中另外一种模式:原型模式。就是将公用的属性和方法加载在原型上(prototype)。
//原型(prototype)要写在构造函数下面。//原型相当于CSS中Class,普通方法和属性相当于标签元素里的style。所以原型的优先级要普通方法和属性。function Person(){}Person.prototype.name = "彬彬";Person.prototype.sex = "男";Person.prototype.age = "10";Person.prototype.msg = function(){console.log("姓名:"+this.name+" 性别:"+this.sex+" 年龄:"+this.age);}var person1 = new Person();person1.msg();var person2 = new Person();person2.name = "晃晃";person2.msg();//思考:这种修改属性比较麻烦???//解决问题方法:把属性写在构造函数内,方法采用原型模式写,着就叫JS混合的模式
function Person(name,sex,age){this.name = name;this.sex = sex;if(age){this.age = age; //优先级高于原型}}Person.prototype.age = 10;Person.prototype.getName = function(){console.log(this.name);}Person.prototype.msg = function(){console.log("姓名:"+this.name+" 性别:"+this.sex+" 年龄:"+this.age);}var person1 = new Person("彬彬1","男",80);var person2 = new Person("倩倩1","女");person1.msg();person1.getName();person2.msg();console.log(person1.msg == person2.msg);//true
js设计模式:工厂模式、构造函数模式、原型模式、混合模式的更多相关文章
- 设计模式之第9章-原型模式(Java实现)
设计模式之第9章-原型模式(Java实现) “快到春节了,终于快放假了,天天上班好累的说.”“确实啊,最近加班比较严重,项目快到交付了啊.”“话说一到过节,就收到铺天盖地的短信轰炸,你说发短信就发吧, ...
- .NET设计模式(6):原型模式(Prototype Pattern)(转)
概述 在软件系统中,有时候面临的产品类是动态变化的,而且这个产品类具有一定的等级结构.这时如果用工厂模式,则与产品类等级结构平行的工厂方法类也要随着这种变化而变化,显然不大合适.那么如何封装这种动态的 ...
- NET设计模式 第二部分 创建型模式(5):原型模式(Prototype Pattern)
原型模式(Prototype Pattern) ——.NET设计模式系列之六 Terrylee,2006年1月 概述 在软件系统中,有时候面临的产品类是动态变化的,而且这个产品类具有一定的等级结构.这 ...
- 设计模式(C#)——04原型模式
推荐阅读: 我的CSDN 我的博客园 QQ群:704621321 在软件开发过程中,我们习惯使用new来创建对象.但是当我们创建一个实例的过程很昂贵或者很复杂,并且需要创建多个这样的 ...
- C#设计模式学习笔记:(5)原型模式
本笔记摘抄自:https://www.cnblogs.com/PatrickLiu/p/7640873.html,记录一下学习过程以备后续查用. 一.引言 很多人说原型设计模式会节省机器内存,他们说 ...
- Java 设计模式系列(五)原型模式
Java 设计模式系列(五)原型模式 原型模式属于对象的创建模式.通过给出一个原型对象来指明所有创建的对象的类型,然后用复制这个原型对象的办法创建出更多同类型的对象.这就是选型模式的用意. 一.原型模 ...
- .NET设计模式(6):原型模式(Prototype Pattern)
):原型模式(Prototype Pattern) ); //使用颜色 string colorName = "red"; C ...
- 设计模式总结篇系列:原型模式(Prototype)
首先对原型模式进行一个简单概念说明:通过一个已经存在的对象,复制出更多的具有与此对象具有相同类型的新的对象. 在理解Java原型模式之前,首先需要理解Java中的一个概念:复制/克隆. 在博文< ...
- 设计模式之(六)原型模式(ProtoType)
认识原型模式 原型模式是比较简单的设计模式.废话不多说,直接看定义:用原型实例指定创建对象的种类,并通过拷贝这些原型创建新的对象.通过实例指定种类,种类就是初始化的类,然后通过拷贝创建对象.先展示一个 ...
- 设计模式学习-使用go实现原型模式
原型模式 定义 代码实现 优点 缺点 适用场景 参考 原型模式 定义 如果对象的创建成本比较大,而同一个类的不同对象之间差别不大(大部分字段都相同),在这种情况下,我们可以利用对已有对象(原型)进行复 ...
随机推荐
- 关于sharepoint如何做SSO,如何做OOS监视编辑
应客户需求,需要做sharepoint SSO,以前都是默认的AD验证,如果客户已经有一套SSO系统,验证过SSO之后就能自动登录,而不是浏览器上设置保存用户名密码的AD登陆. 怎么做呢? 首先sha ...
- CSS 高级选择器
相信各位如我一样的“抠图崽”和前端大佬们,在写网页样式的实话,总是免不了写下各种各样的选择器,再给选择的元素写入样式.最基本的元素选择器.class选择器.ID选择器等就不再过多的说了,相信大家都熟的 ...
- iOS:PrefixHeader / 头文件 / 宏定义(18-03-02更)
宏定义,不一定放在PCH文件,可能放在一个.h文件,再用PCH包含进来. 1.屏幕尺寸 // 屏幕尺寸 #define kSCREEN_WIDTH [UIScreen mainScreen].boun ...
- ZooKeeper分布式
1:zk的相关特性 1.一致性:数据一致性,数据按顺序分批入库. 2.原子性:事务要么都成功,要么都失败,不会局部化. 3.单一视图:客户端连接集群中的任一zk节点,数据都是一致的. 4.可靠性:每次 ...
- 复习宝典之MyBatis
查看更多宝典,请点击<金三银四,你的专属面试宝典> 第五章:MyBatis MyBatis是一个可以自定义SQL.存储过程和高级映射的持久层框架. 1)创建sqlsession的流程 my ...
- Spring Boot 微信-验证服务器有效性【转】
转:https://blog.csdn.net/jeikerxiao/article/details/68064145 概述 接入微信公众平台开发,开发者需要按照如下步骤完成: 在自己服务器上,开发验 ...
- 在IOS端点击数字后会调起系统拨号界面
在IOS端点击数字后会调起系统拨号界面,解决方案: <meta name="format-detection" content="telephone=no" ...
- 线上服务内存OOM问题定位三板斧
相信大家都有感触,线上服务内存OOM的问题,是最难定位的问题,不过归根结底,最常见的原因: 本身资源不够 申请的太多 资源耗尽 58到家架构部,运维部,58速运技术部联合进行了一次线上服务内存OOM问 ...
- Delphi 拦截滚轮事件不响应滚轮的上下滚动
unit Unit1; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms ...
- Final,finally,finalize区别
final— 修饰符(关键字)如果一个类被声明为final,意味着它不能再派生出新的子类,不能作为父类被继承.因此一个类不能既被声明为 abstract的,又被声明为final的.将变量或方法声明为f ...