微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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,job) { this.name = name; this.age = age; this.job = job; this.sayName = function () {

console.info(this.name); }; } //使用new调用对象构造函数创建对象 var p1 = new Person('张三','软件工程师');

var p2 = new Person('李四','医生');

以普通方式调用的“构造函数

构造函数其实也是一个函数,不同之处在于调用它时必须要加一个“new”关键字,如果不加这个关键字,则对它的调用被认为是普通函数调用

代码如下:
函数调用的构造函数,通过this添加属性, //成为了window对象的属性方法。 console.info(window.name);//张三 console.info(window.age); //29 console.info(window.job); //软件工程师

对象构造函数长得这个样:

代码如下:

实际上是这样(示意):

代码如下:

构造函数完成的工作

1. 创建一个新的对象 2. 让构造函数的this引用这一新创建的对象 3. 执行构造函数中的代码,这些代码通常完成向新对象添加属性的工作 4. 向外界返回新创建的对象引用。

对象构造函数与对象工厂方法的区别

1. 对象构造函数中没有显式的对象创建代码 2. 新对象应具备的属性方法是通过this引用添加的. 3. 对象构造函数中没有return语句

通常会把对象构造函数的首字母设置为大写的,以区别于普通函数。 对象的constructor属性

a).使用对象工厂函数创建对象,每个对象的constructor属性引用Object()

代码如下:
方法创建对象,

其constructor属性引用Object()函数 console.info(person1.constructor === Object);

//true

b).使用对象构造函数创建对象,每个对象的constructor属性引用这个构造函数

代码如下:
函数创建对象, //每个对象的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了,就加上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设计模式之对象工厂函数与构造函数详解,希望大家喜欢。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐