javascript工厂模式和构造函数模式创建对象方法解析


Posted in Javascript onDecember 30, 2016

工厂模式是软件工程领域一种广为人知的设计模式,这种模式抽象了创建具体对象的过程(本书后面还将讨论其他设计模式及其在JavaScript 中的实现)。考虑到在ECMAScript 中无法创建类,开发人员就发明了一种函数,用函数来封装以特定接口创建对象的细节,如下面的例子所示。

function createPerson(name, age, job){
 var o = new Object();
 o.name = name;
 o.age = age;
 o.job = job;
 o.sayName = function(){
 alert(this.name);
 };
 return o;
}
var person1 = createPerson("Nicholas", 29, "Software Engineer");
var person2 = createPerson("Greg", 27, "Doctor");

函数createPerson()能够根据接受的参数来构建一个包含所有必要信息的Person 对象。可以无数次地调用这个函数,而每次它都会返回一个包含三个属性一个方法的对象。工厂模式虽然解决了创建多个相似对象的问题,但却没有解决对象识别的问题(即怎样知道一个对象的类型)。随着JavaScript的发展,又一个新模式出现了。

二、构造函数模式

像Object 和Array 这样的原生构造函数,在运行时会自动出现在执行环境中。此外,也可以创建自定义的构造函数,从而定义自定义对象类型的属性和方法。例如,可以使用构造函数模式将前面的例子重写如下。

function Person(name, age, job){
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayName = function(){
 alert(this.name);
 };
}
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");

在这个例子中,Person()函数取代了createPerson()函数。我们注意到,Person()中的代码除了与createPerson()中相同的部分外,还存在以下不同之处:

  • 没有显式地创建对象;
  • 直接将属性和方法赋给了this 对象;
  • 没有return 语句。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
javascript 数组学习资料收集
Apr 11 Javascript
JavaScript定时器详解及实例
Aug 01 Javascript
ajax读取数据后使用jqchart显示图表的方法
Jun 10 Javascript
js判断是否为空和typeof的用法(详解)
Oct 07 Javascript
JavaScript实现动态添加Form表单元素的方法示例
Aug 14 Javascript
Vue仿手机qq的实例代码(demo)
Sep 08 Javascript
微信小程序之数据缓存的实例详解
Sep 29 Javascript
浅谈vue项目可以从哪些方面进行优化
May 05 Javascript
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
Feb 20 jQuery
vue cli3 调用百度翻译API翻译页面的实现示例
Sep 13 Javascript
JS禁用右键、禁用Ctrl+u、禁用Ctrl+s、禁用F12的实现代码
Dec 01 Javascript
梳理一下vue中的生命周期
Dec 30 Vue.js
ajax图片上传,图片异步上传,更新实例
Dec 30 #Javascript
浅谈JavaScript的函数及作用域
Dec 30 #Javascript
解析ajaxFileUpload 异步上传文件简单使用
Dec 30 #Javascript
JS实现的样式切换功能tableCSS实例
Dec 30 #Javascript
浅谈js script标签中的预解析
Dec 30 #Javascript
jQuery实现页面顶部下拉广告
Dec 30 #Javascript
jQuery Password Validation密码验证
Dec 30 #Javascript
You might like
php zlib压缩和解压缩swf文件的代码
2008/12/30 PHP
服务器web工具 php环境下
2010/12/29 PHP
有关于PHP中常见数据类型的汇总分享
2014/01/06 PHP
PHP 实现代码复用的一个方法 traits新特性
2015/02/22 PHP
php使用GD创建保持宽高比缩略图的方法
2015/04/17 PHP
全面了解PHP中的全局变量
2016/06/17 PHP
详解在YII2框架中使用UEditor编辑器发布文章
2018/11/02 PHP
Laravel框架Auth用户认证操作实例分析
2019/09/29 PHP
firefox和IE系列的相关区别整理 以备后用
2009/12/28 Javascript
IE6/7/8/9不支持exec的简写方式
2011/05/25 Javascript
jQuery的deferred对象使用详解
2011/08/20 Javascript
javascript时区函数介绍
2012/09/14 Javascript
JS+CSS实现的竖向简洁折叠菜单效果代码
2015/10/22 Javascript
Jquery实现$.fn.extend和$.extend函数
2016/04/14 Javascript
JS实现将数字金额转换为大写人民币汉字的方法
2016/08/02 Javascript
简单实现vue验证码60秒倒计时功能
2017/10/11 Javascript
JS把字符串格式的时间转换成几秒前、几分钟前、几小时前、几天前等格式
2019/07/10 Javascript
vue设置一开始进入的页面教程
2019/10/28 Javascript
JavaScript实现简单进度条效果
2020/03/25 Javascript
解决vue项目本地启动时无法携带cookie的问题
2021/02/06 Vue.js
[00:10]DOTA2全国高校联赛速递
2018/05/30 DOTA
windows下搭建python scrapy爬虫框架步骤
2018/12/23 Python
python 二维数组90度旋转的方法
2019/01/28 Python
Python 操作mysql数据库查询之fetchone(), fetchmany(), fetchall()用法示例
2019/10/17 Python
Django中提示消息messages的设置方式
2019/11/15 Python
Python绘图实现显示中文
2019/12/04 Python
Python内置类型性能分析过程实例
2020/01/29 Python
jupyternotebook 撤销删除的操作方式
2020/04/17 Python
python实现密度聚类(模板代码+sklearn代码)
2020/04/27 Python
一篇文章搞懂python的转义字符及用法
2020/09/03 Python
浅谈CSS3鼠标移入图片动态提示效果(transform)
2017/11/06 HTML / CSS
css3 伪类选择器快速复习小结
2019/09/10 HTML / CSS
详解H5 活动页之移动端 REM 布局适配方法
2017/12/07 HTML / CSS
优秀英语专业毕业生求职信
2013/11/23 职场文书
粗暴解决CUDA out of memory的问题
2021/05/22 Python
JavaScript 中for/of,for/in 的详细介绍
2021/11/17 Javascript