关于js的对象创建方法(简单工厂模式,构造函数模式,原型模式,混合模式,动态模式)
// 1.工厂方式创建对象:面向对象中的封装函数(内置对象)
简单来说就是封装后的代码,简单的工厂模式是很好理解的,关于它的作用,就是利用面向对象的方法,把一些对象封装,使一些占用空间多的,重复的代码封装起来。实现方法非常简单,也就是在函数内创建一个对象,给对象赋予属性以及方法再将对象返回即可。
function createPerson(name){
var obj=new Object();//1.原料
//2.加工
obj.name=name;
obj.showName=function(){
alert(this.name);
}
return obj;//3.出厂
}
可以看出,使用工厂模式,可以重复调用这个per函数来生成不同属性值得对象,这就像工厂一样,批量生产,里面的原料,加工,出厂都很清晰。但是你会发现工厂模式是无法识别对象的类型,因为全都是object,不像Date,Array等,但是构造函数就不是了。这还只是简单的工厂模式,复杂的工厂模式(抽象模式)等以后再回来详细了解。
//2、构造函数创建对象
//当new去调用一个函数,这个时候函数中的this就是创建出来的对象,而且函数的返回值就是this(隐式返回)
//new后面的函数叫做构造函数
// <1>有参数的构造函数
function CreatePerson(name){
this.name=name;
this.showName=function(){
alert(this.name);
}
}
var p1=new CreatePerson('小米');
p1.showName();
// <2>无参数的构造函数
function CreatePerson(){}
var p1=new CreatePerson();
p1.name="吃丸子";
p1.showName=function(){
alert(p1.name);
}
p1.showName();
// 3.用原型方式
function Person(){}js规定每一个创建的函数都有prototype(原型)属性,这个属性是指针,指向一个对象,而这个对象的用途是包含由特定类型的所有实例所共享的属性和方法,使用原型对象就可以让所有实例对象均包含这些属性及方法。
Person.prototype.name="hello";
Person.prototype.showName=function(){
alert(this.name);
}
var p1=new Person();
p1.showName();
关于原型模式的缺点,我想也是很明显的,它省略了构造函数传递初始化参数这一环节,结果所有实例均在默认情况下取得了相同的属性值,虽然你可以在后来做出更改,但一点都不方便,这样还不是最大的问题,原型模式最大的问题是在于共享的本性所导致的,由于共享,因此一个实例修改了引用,另一个也随之更改了属性。因此一般不会单独使用原型模式。
//4.混合构造函数和原型模式
function CreatePerson(name){
this.name=name;
}
CreatePerson.prototype.showName=function(){
alert(this.name);
}
var p1=new CreatePerson("加油");
p1.showName();
var p2=new CreatePerson("加油呀!");
p2.showName();
alert(p1.showName==p2.showName);//true;原因:都是在原型下面,在内存中只存在一份,地址相同
function per(name){
this.name=name;
}
per.prototype.say=function(){
alert(this.name);
}
var per1=new per('lyf');
var per2=new per ('xiaoai');
per1.say();
per2.say();
//<5>动态模式
function per(name){
this.name=name;
if(typeof this.say!='function'){
// 这段代码只执行了一次
per.prototype.say=function(){
console.log(this.name);
}
}
}
var per1=new per('katherine');
var per2=new per('xiaoai');
per1.say();
per2.say();
动态原型模式将所有的信息都封装进了构造函数中,通过构造函数中初始化原型,仅第一个对象实例实例化时初始化,通过判断该方法是否有效存在而选择是否需要初始化。大白话就是:如果去掉if的话,每new一次(即每当一个实例对象生产时),都会重新定义一个新的函数,然后挂到per.prototype.say上,而实际上,只需要定义一次就够了,因为所有的实例都会共享此属性的,所以如果去掉if的话,会造成没有必要的时间和空间的浪费,而加上if后,只在new第一次实例化时会定义say方法,之后都不会再定义了。可以看出对于这种模式创建的对象,是最好的了。
关于js的对象创建方法(简单工厂模式,构造函数模式,原型模式,混合模式,动态模式)的更多相关文章
- js中对象和对象创建方法
这一次我们来说一说在JavaScript中经常会用到的一个复杂基本类型,对象,先从对象的属性讲起,再讲对象的创建方法,基本涵盖了创建对象的各种方法,大家一起学习呀~ 一.对象 要掌握对象的使用及继承, ...
- JS中的对象和方法简单剖析
众所周知,在js中对象就是精髓,不理解对象就是不理解js. 那么什么事js中的对象呢? 在js中,几乎一切皆对象: Boolean ,String,Number可以是对象(或者说原生数据被认作对象): ...
- 【原】js数组对象去重最简单的方法
简单的数组去重是比较简单的,方法也特别多,如给下面的数组去重: let arr = [1,2,2,4,9,6,7,5,2,3,5,6,5] 最常用的可以用for循环套for循环,再用splice删除重 ...
- JS常用的设计模式(2)——简单工厂模式
简单工厂模式是由一个方法来决定到底要创建哪个类的实例, 而这些实例经常都拥有相同的接口. 这种模式主要用在所实例化的类型在编译期并不能确定, 而是在执行期决定的情况. 说的通俗点,就像公司茶水间的饮料 ...
- 对JS关于对象创建的几种方式的整理
最近一直在看JS高级程序设计这本书,有空来梳理一下几种创建对象的方式.话不多说,直接步入正题. 第一种:Object构造函数创建 var Person = new Object();Person.na ...
- 用ES6创建一个简单工厂模式
1 什么是工厂模式? 工厂模式是用来创建对象的一种最常用的设计模式.我们不暴露创建对象的具体逻辑,而是将将逻辑封装在一个函数中,那么这个函数就可以被视为一个工厂.工厂模式根据抽象程度的不同可以分为:简 ...
- 《JS设计模式笔记》 2,简单工厂模式
<script type="text/javascript"> //简单工厂模式 //定义:由一个方法来决定到底要创建哪个类的实例,而这些实例经常拥有相同的接口.其实例 ...
- 第163天:js面向对象-对象创建方式总结
面向对象-对象创建方式总结 1. 创建对象的方式,json方式 推荐使用的场合: 作为函数的参数,临时只用一次的场景.比如设置函数原型对象. var obj = {}; //对象有自己的 属性 和 行 ...
- [JavaScript]对象创建方法
1.使用Object或对象字面量创建对象 (1)使用Object创建对象 var cat= new Object(); cat.name = "Tom"; cat.color= & ...
随机推荐
- kettle 连接 Oracle 异常
场景重现 新安装的 kettle(pdi-ce-7.0.0.0-25) 连接 Oracle 11G R2 报错如下: 解决办法 到 Oracle 官网 JDBC Downloads 下载对应的 ojd ...
- NodeJS:(一)特性&环境&测试
特性: ①非阻塞I/O,事件驱动,单线程 非阻塞I/O:进程不等I/O完成(阻塞是等I/O完成后才进行下一步) 事件驱动:异步操作结束后通知 ②优点 前端职责范围变大,统一开发体验 处理高并发(单位时 ...
- Kafka-Record(消息格式)
注:本文依赖于kafka-0.10.0.1-src kafka消息格式是经过多个版本的演变的,本文只说0.10.0.1版本的消息格式. 消息格式如图1所示: 图1 CRC:用于校验消息内容.占4个字节 ...
- GO | KEGG的注释是怎么来的?
但凡是做过基因表达数据分析的(芯片.RNA-seq,scRNA-seq),肯定是跑过基因集功能注释和通路富集的,因为它是研究未知基因集的利器. 但跑过之后老板肯定会给反馈,通常得到的注释都是没有太多意 ...
- 摘录和再编:彻底弄懂JS执行机制
网文: https://juejin.im/post/59e85eebf265da430d571f89 并发模型和事件循环:https://developer.mozilla.org/zh-CN/do ...
- style.width与offsetWidth的区别
1. style.width只能读取内联样式,offsetWidth都可以读取: 2. style.width读取的值带“px”单位,offsetWidth读取纯数值: 3. style.width获 ...
- 『Numpy』内存分析_高级切片和内存数据解析
在计算机中,没有任何数据类型是固定的,完全取决于如何看待这片数据的内存区域. 在numpy.ndarray.view中,提供对内存区域不同的切割方式,来完成数据类型的转换,而无须要对数据进行额外的co ...
- Oracle DB 使用RMAN恢复目录
• 对恢复目录和RMAN 资料档案库控制文件的使用进行比较• 创建和配置恢复目录• 在恢复目录中注册数据库• 同步恢复目录• 使用RMAN 存储脚本• 备份恢复目录• 创建虚拟专用目录 RMAN 资料 ...
- 从Excel、CSV文件获取数据
#region 从Excel获取数据 /// <summary> /// 从Excel获取数据 /// </summary> /// <param name=" ...
- java使用valueOf的方法反转字符串输出
public class FanZhuan { public static void main(String[] args) { String s = "987654321088123abo ...