js工厂模式,构造函数模式,原型模式

本文介绍了JavaScript中的三种对象创建模式:工厂模式、构造函数模式和原型模式。工厂模式通过封装创建对象的细节,实现代码复用但无法明确对象类型。构造函数模式解决了对象识别问题,使实例同时属于Object和特定构造函数的实例。原型模式利用原型属性,让所有实例共享原型对象的方法和属性,避免了构造函数模式下每个实例拥有独立方法的缺点。
摘要由CSDN通过智能技术生成

1.工厂模式

function cPerson(name, color, age) {
				var car = new Object();
				car.name = name;
				car.color = color;
				car.age = age;
				car.show = function() {
					console.log(this.name + this.age + this.color);
				}
		 	return car;
			}
			var p1 = cPerson('雷克萨斯', 'pink', 2010);
			p1.show();
			var p2 = cPerson('一汽大众', 'black', 2014);
			p2.show();

工厂模式抽象了具体对象的过程。也就是说,发明了一种函数,把对象放到函数里,用函数封装创建对象的细节。

工厂模式解决了代码复用的问题,但是却没有解决对象识别的问题。即创建的所有实例都是Object类型。为了解决这一问题,就有了构造函数模式

2.构造函数模式

function CPerson(name, color, age) {
				this.name = name;
				this.color = color;
				this.age = age;
				this.show = function() {
					console.log(this.name + this.age + this.color);
				}
			}
			var p1 = new CPerson('华晨宝马', 'gold', 2020);
			p1.show();
			var p2 = new CPerson('东风雪铁龙', 'white', 2019);
			p2.show();
  1. 构造函数 Person 有一个prototype(原型)属性,这个属性是一个指针,指向一个对象即:Person.prototype(原型对象);
  2. 构造函数解决了对象识别问题,我们在这个例子中创建的对所有对象既是Object的实例,同时,也是Person的实例。这一点通过instanceof操作符可以得到验证。

console.log(p1 instanceof Object)  //true
console.log(p1 instanceof CPerson)  //true

3.原型模式

function BOX() {}
			BOX.prototype.name = '东风起亚悦达';
			BOX.prototype.color = 'purple';
			BOX.prototype.age = 2013;
			BOX.prototype.show = function() {
				console.log(this.name + this.age + this.color);
			}
			var p1 = new BOX();
			p1.show();
			var p2 = new BOX();
			p2.show();
			console.log(p1.show == p2.show)

首先我们要知道,我们创建的每一个函数都有一个隐藏属性,也就是 原型属性。这个原型属性指向一个原型对象。且所有实例和构造函数 都指向这个原型对象,共享 原型对象的所有方法和属性。
我们通过操作原型对象达到 实例共享属性方法的目的,就是原型模式。
同时,因为实例都是引用 原型对象的属性和方法,也避免了构造函数模式下所有实例都有各自的方法的弊端。

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值