javascript设计模式之对象工厂函数与构造函数详解
下面通过文字详解加代码分析的方式给大家分享下javascript设计模式之对象工厂函数与构造函数的相关知识。
概述使用对象字面量,或者向空对象中动态地添加新成员,是最简单易用的对象创建方法。然而,除了这两种常用的对象创建方式,javascript还提供了其他方法创建对象。1).使用工厂函数创建对象我们可以编写一个函数,此函数的功能就是创建对象,可将其.
概述
使用对象字面量,或者向空对象中动态地添加新成员,是最简单易用的对象创建方法。
然而,除了这两种常用的对象创建方式,javascript还提供了其他方法创建对象。
1).使用工厂函数创建对象
我们可以编写一个函数,此函数的功能就是创建对象,可将其称为“对象工厂方法”。
//工厂函数
function createperson(name, age, job) {
var o = new object();
o.name = name;
o.age = age;
o.job = job;
o.sayname = function () {
console.info(this.name);
};
return o; } //使用工厂函数创建对象
var person1 = createperson('张三', 29, '软件工程师');
var person2 = createperson('李四', 40, '医生');
2).定义对象构造函数
a).对象构造函数首字母大写
b).内部使用this关键字给对象添加成员
c).使用new关键字调用对象构造函数
//定义对象“构造”函数
function person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.sayname = function () {
console.info(this.name);
};
} //使用new调用对象构造函数创建对象
var p1 = new person('张三', 29, '软件工程师');
var p2 = new person('李四', 40, '医生');
以普通方式调用的“构造函数”
构造函数其实也是一个函数,不同之处在于调用它时必须要加一个“new”关键字,如果不加这个关键字,则对它的调用被认为是普通函数调用。
//作为普通函数调用的构造函数,通过this添加的属性,
//成为了window对象的属性与方法。
console.info(window.name);//张三
console.info(window.age); //29
console.info(window.job); //软件工程师
对象构造函数长得这个样:
function person (name) {
this.name = name;
this.say = function () {
return "i am " + this.name;
};
}
实际上是这样(示意):
function person (name) {
// var this = {};
this.name = name;
this.say = function () {
return "i am " + this.name;
};
// return this;
}
构造函数完成的工作
1. 创建一个新的对象
2. 让构造函数的this引用这一新创建的对象
3. 执行构造函数中的代码,这些代码通常完成向新对象添加属性的工作
4. 向外界返回新创建的对象引用。
对象构造函数与对象工厂方法的区别
1. 对象构造函数中没有显式的对象创建代码
2. 新对象应具备的属性与方法是通过this引用添加的.
3. 对象构造函数中没有return语句
通常会把对象构造函数的首字母设置为大写的,以区别于普通函数。
对象的constructor属性
a).使用对象工厂函数创建对象,每个对象的constructor属性引用object()
var person = createperson('张三', 29, '软件工程师');
//使用工厂方法创建对象,
其constructor属性引用object()函数
console.info(person1.constructor === object);
//true
b).使用对象构造函数创建对象,每个对象的constructor属性引用这个构造函数
var p = new person('张三', 29, '软件工程师');
//使用对象构造函数创建对象,
//每个对象的constructor属性,引用这个构造函数
console.info(p.constructor === person);
//true如何避免“忘记”new?可以使用arguments.callee解决这个问题
//了解arguments.callee的作用
function testargumentscallee()
{
console.info(this);
console.info(this instanceof testargumentscallee);
console.info(this instanceof arguments.callee);
};
testargumentscallee(); //window
//false
//false
new testargumentscallee();
//testargumentscallee
//true
//true
于是,可以直接用arguments.callee
//避免忘记new
function myobject(value)
{
if (!(this instanceof arguments.callee))
{
//如果调用者忘记加上new了,就加上new再调用一次
return new myobject(value);
}
this.prop = value;
}
//测试
var obj1 = new myobject(100);
console.info(obj1.prop);//100
var obj2 = myobject(200);
console.info(obj2.prop); //200
以上内容就是javascript设计模式之对象工厂函数与构造函数详解,希望大家喜欢。
推荐阅读
-
JavaScript中工厂函数与构造函数示例详解
-
javascript工厂模式和构造函数模式创建对象方法解析
-
javascript设计模式之对象工厂函数与构造函数详解
-
JavaScript创建对象方式总结【工厂模式、构造函数模式、原型模式等】
-
JavaScript设计模式之构造函数模式实例教程
-
JavaScript中工厂函数与构造函数示例详解
-
详解js产生对象的3种基本方式(工厂模式,构造函数模式,原型模式)
-
javascript工厂模式和构造函数模式创建对象方法解析
-
javascript设计模式之对象工厂函数与构造函数详解
-
深入理解JavaScript系列(26):设计模式之构造函数模式详解_javascript技巧