创建javascript对象

本文深入探讨JavaScript中创建对象的八种方法,包括使用new操作符、对象字面量、工厂模式、构造函数模式、原型模式、组合使用构造函数和原型模式、动态原型模式及寄生构造函数模式,每种方法的特点及适用场景。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

创建Object实例

本文实例来源于《javascript高级编程》
1、方法一:new操作符后加Object构造函数

var person = new Object();//等价于 var person = {};
person.name = "qianbei";
person.age  = 29;
person.sayName = function(){
	alert(this.name); // 被解析为person.name
}

2、方法二:使用对象字面量表示法

var person = {
	name : "qianbei",
	age : 29,
	sayName : function(){
		alert(this.name); // 被解析为person.name
	}
};

虽然构造函数或对象字面量都可以用来创建单个对象,但这些方法有一个明显的缺点,使用同一个接口创建很多对象,会产生大量的重复代码,为了解决这个问题,人们开始使用工厂模式的一种变体。

3、方法三:工厂模式

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 = new createPerson("qianbei",29,"FE");
var person2 = new createPerson("chenchen",18,"FE");

工厂模式虽然解决了创建多个相似对象的问题,但却没有解决对象识别问题。

4、方法四:构造函数模式

function Person(name,age,job){//按照惯例,构造函数应该以大写字母开头
	this.name = name;
	this.age  = age;
	this.job = job;
	this.sayName = function(){
		alert(this.name); // 被解析为person.name
	};
}

var person1 = new Person("qianbei",29,"FE");
var person2 = new Person("chenchen",18,"FE");

要创建Person实例,必须使用new操作符,以这种方式调用构造函数实际上会经历以下4个步骤:
1) 创建一个新对象
2) 将构造函数的作用域赋给新对象(因此this就指向了这个新对象)
3) 执行构造函数的代码(为这个新对象添加属性)
4) 返回新对象

在前面例子最后,person1,person2分别保存着Person的一个不同实例,这两个对象都有一个constructor属性,该属性指向person

alert(person1.constructor == Person) //true
alert(person2.constructor == Person) //true

5、方法五:原型模式

function Person(){}
Person.prototype.name = "qianbei";
Person.prototype.age= "18";
Person.prototype.job= "fe";
Person.prototype.sayName=function(){
	return this.name;
};
var person1 = new Person();
alert(person1.age);

6、方法六:组合使用构造函数模式和原型模式(是目前使用最广泛,认同度最高的一种能够创建自定义类型的方法)

function Person(name,age,job){//按照惯例,构造函数应该以大写字母开头
	this.name = name;
	this.age  = age;
	this.job = job;
}
Person.prototype = {
	constructor : Person,
	sayName : function(){
		return this.name;
	};
}
var person1 = new Person("qianbei",18,"FE");
var person2 = new Person("chenchen",20,"FE");
alert(person1.age);
alert(person1.sayName =  person2.sayName) //true

7、方法七:动态原型模式

function Person(name,age,job){//按照惯例,构造函数应该以大写字母开头
	this.name = name;
	this.age  = age;
	this.job = job;
	if(typeof this.sayName != "function"){
		Person.prototype.sayName=function(){
			return this.name;
		};
	}
}
var friend = new Person("qianbei",18,"FE");
alert(friend.sayName());

8、方法八:寄生构造函数模式

function Person(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 = new Person("qianbei",29,"FE");
var person2 = new Person("chenchen",18,"FE");
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值