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设计模式之对象工厂函数与构造函数详解,希望大家喜欢。

(0)

相关推荐

  • js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式)

    在上篇文章给大家介绍了javascript面向对象基础,本篇文章继续深入学习javascript面向对象,JS的语法非常灵活,简单的对象创建就有好几种不同的方法.这些过于灵活的地方有时候确实很让人迷惑,那么今天我们就来梳理一下JS中常用的创建对象的几种方法吧. 前言 虽然使用 Object构造函数 或者使用 对象字面量 可以很方便的用来创建一个对象,但这种方式有一个明显的缺点:使用一个接口创建多个对象会产生很多冗余的代码.因此为了解决这个问题,人们开始使用以下几种方式来常见对象. 工厂模式 该模

  • javascript创建对象的几种模式介绍

    在js中有几种模式可以创建对象,通过对象操作所包含的属性与方法. 一般来说,构造函数名称的第一个字母为大写字母,非构造函数名称的第一个字母为小写字母,当然,构造函数与一般函数唯一的区别只是调用的方式不同而已,所以任何函数只要通过new来调用,那它就可以作为构造函数,若不通过new来调用,则与一般函数一样. 谈谈我对这几种模式的理解: 工厂模式:创建一个一般函数,在函数里创建一个Object对象,为这个对象增添属性与方法,同时赋予其值,最后返回对象.无法识别对象类型. 构造函数模式:创建构造函数,

  • Javascript面向对象设计一 工厂模式

    1.工厂模式抽象了创建具体对象的过程,但是在ECMAScript中无法创建类,所以就使用一种函数来封装以特定接口创建对象的细节.以一下情况为例, 有一个员工类,有姓名.年龄.职位属性, 复制代码 代码如下: function CreateEmployee(name, age, job) { var Emp = new Object(); Emp.name = name; Emp.age = age; Emp.job = job; Emp.sayName = function () { alert

  • JS面向对象基础讲解(工厂模式、构造函数模式、原型模式、混合模式、动态原型模式)

    什么是面向对象?面向对象是一种思想!(废话). 面向对象可以把程序中的关键模块都视为对象,而模块拥有属性及方法.这样我们如果把一些属性及方法封装起来,日后使用将非常方便,也可以避免繁琐重复的工作.接下来将为大家讲解在JS中面向对象的实现.   工厂模式 工厂模式是软件工程领域一种广为人知的设计模式,而由于在ECMAScript中无法创建类,因此用函数封装以特定接口创建对象.其实现方法非常简单,也就是在函数内创建一个对象,给对象赋予属性及方法再将对象返回即可. function createBlo

  • 构造函数+原型模式构造js自定义对象(最通用)

    复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> /* * 组合模式: 构造函数模式+原型模式 这种方式是javascript中最通用的创建对象的方式 变量类型属性:用构造函数传

  • javascript 设计模式之单体模式 面向对象学习基础

    单体模式(singleton) 单体是在脚本加载时创建的,能将一系列有关联的变量和方法组织为一个逻辑单元,逻辑单元里面的内容通过单一的变量进行访问: 一个单体主要分为三部分 用于访问内部信息的入口变量(如:Sky) 属性(如:nickName/age/timeInfo) 方法(如:sayHello) 基本结构 复制代码 代码如下: var Sky = { /* * 作用一,变量管理 */ nickName: "sky", age: "26", /* * 作用二,加载

  • 在javascript中创建对象的各种模式解析

    最近在看<javascript高级程序设计>(第二版) javascript中对象的创建 •工厂模式 •构造函数模式 •原型模式 •结合构造函数和原型模式 •原型动态模式 面向对象的语言大都有一个类的概念,通过类可以创建多个具有相同方法和属性的对象.虽然从技术上讲,javascript是一门面向对象的语言,但是javascript没有类的概念,一切都是对象.任意一个对象都是某种引用类型的实例,都是通过已有的引用类型创建:引用类型可以是原生的,也可以是自定义的.原生的引用类型有:Object.A

  • JavaScript对象创建模式实例汇总

    本文实例总结了JavaScript对象创建模式.分享给大家供大家参考,具体如下: 在JavaScript中创建对象是很容易的,可以使用对象字面量或者构造函数.常用的创建对象的模式有以下几种: 一. 工厂模式 工厂模式抽象了具体对象的过程,用函数来封装以特ing接口创建对象的细节. 如下: function createAnimal(name, age) { var o = new Object(); o.name = name; o.age = age; o.sayName = function

  • JavaScript中创建对象的模式汇总

    JavaScript中创建对象的模式汇总 **JavaScript创建对象模式: 对象字面量 工厂模式 构造函数模式 原型模式 结合构造函数和原型模式 原型动态模式 ** 面向对象的语言大都有一个类的概念,通过类可以创建多个具有相同方法和属性的对象.虽然从技术上讲,javascript是一门面向对象的语言,但是javascript没有类的概念,一切都是对象.任意一个对象都是某种引用类型的实例,都是通过已有的引用类型创建:引用类型可以是原生的,也可以是自定义的. 1.对象字面量 var perso

  • javascript 单例模式演示代码 javascript面向对象编程

    js的单例写法 JS单例模式 div{height:100px; width:100px; background:#CCC; border:#000 1px solid;} my = new function yangbin() { this.name = "我是单例funnyzak!"; }; function yangbin1(){ this.name = "我是funnyzak!"; } function myname(){ var u = new yangb

  • 理解js对象继承的N种模式

    本文分享了js对象继承的N种模式,供大家参考. 一.原型链继承 function Person(){}; Person.prototype = { constructor: Person, name: "Oliver" }; function People(){}; People.prototype = new Person(); People.prototype.constructor = People; People.prototype.sayName = function(){

随机推荐