在JavaScript中虽说可以用Object的构造函数或者字面量创建单个对象,但是用这些方式来创建多个对象时就有一个明显的缺点,产生了大量的重复代码。为解决这些问题,许多模式就应运而生。

1. 工厂模式

由于在ECMAScript中无法创建类,所以就发明了一种函数,用来封装以特定接口创建对象的细节。

但是以这种方式创建的对象没有解决对象识别问题,即怎样知道一个对象的类型。

function createPerson(name,age,job)
{
var o = new Object();
o.name=name;
o.age=age;
o.job=job;
o.sayHellow=function()
{alert("Hellow"+o.name)};
return o;
} var person1 = createPerson("Jack",34,"Doctor");

2. 构造函数模式

这种方式创建的对象都是属于同一类型的,下面的例子中,所有的对象都是Person类型。

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
this.sayName = function()
{
alert("Hello, "+this.name);
}
} var person1 = new Person("Jack",24,"Doctor");
var person2 = new Person("Simon",34,"Teacher"); alert(person1 instanceof Object); // true
alert(person1 instanceof Person); // true
alert(person2 instanceof Object); // true
alert(person2 instanceof Person); // true

但是这个模式也有缺点,那就是每个方法都要在每个对象的实例中重新创建一遍。就如上面的例子,person1 和person2的sayName方法其实不是Function的同一个实例,是位于两个不同位置的函数指针。

所以可以改进下:

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
this.sayName = sayName;
}
function sayName()
{
alert("Hello, "+this.name);
} var person1 = new Person("Jack",24,"Doctor");
var person2 = new Person("Simon",34,"Teacher"); alert(person1 instanceof Object); // true
alert(person1 instanceof Person); // true
alert(person2 instanceof Object); // true
alert(person2 instanceof Person); // true

3. 原型模式

想弄明白这个模式,必须要想理解prototype.

这个模式有个很大的问题,就是所有对象的属性和方法都是共享的,但是我们可能仅仅想让Person类共享这个sayName 方法,大家应该都想到了,可以用构造函数模式+原型模式来解决这个问题。

function Person(){}
Person.prototype.name="Jack";
Person.prototype.age=33;
Person.prototype.job="IT";
Person.prototype.sayName = function(){alert("Hellow"+ this.name);}; // 字面量写法
function Person(){}
Person.prototype =
{
name: "Jack",
age: 33,
job: "IT",
sayName=function(){alert("Hellow "+this.name);}
}

4. 组合使用构造函数模式和原型模式

用构造函数定义实例属性,存放不共享的数据,用原型模式定义共享的方法和属性,这样可以尽最大可能减少内存开销。

有点类似于c#类的实例成员和静态成员,但只是像。

这中模式是目前用的最广泛,认可太最高的。

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
this.friends=["Toby","Linford"];
}
Person.prototype=
{
constructor: Person,
sayName: function(){alert(this.name);}
} var person1 = new Person("Jack",33,"SDE");
var person2 = new Person("Lucy",25,"Teacher"); person1.friends.push("Jim"); alert(person1.friends); // Toby,Linford,Jim
alert(person2.friends); // Toby,Linford alert(person1.friends==person2.friends); // false
alert(person1.sayName==person2.sayName); //true

5.动态原型模式

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
if(typeof sayName != "function")
{
Person.prototype.sayName=function()
{
alert(this.name);
}
};
}

6. 寄生构造函数模式

其基本思想就是一个函数,该函数的作用仅仅就是封装创建对象的代码,然后再返回新创建的对象。

function createPerson(name,age,job)
{
var o = new Object();
o.name=name;
o.age=age;
o.job=job;
o.sayHellow=function()
{alert("Hellow"+o.name)};
return o;
} var person1 = createPerson("Jack",34,"Doctor");

从上面代码看来和工厂模式是一样的。但是这个模式可以在特殊的情况为对象(特别是内置的对象,如Array)添加构造函数。

7.稳妥构造函数模式

和寄生构造函数模式类似,但有两个不同点,一是创建对象的实例方法不引用this,二是不使用new 调用构造函数。

function Person(name, age, job)
{
//定义要返回的对象
var o = new Object();
//定义私有变量和方法 //添加方法
o.sayName=function(){alert(name);}; return o;
}

在上面的例子中,只有通过sayName才可以访问name.

JavaScript 创建对象的几种模式的更多相关文章

  1. javascript 创建对象的7种模式

    使用字面量方式创建一个 student 对象: var student = function (){ name : "redjoy", age : 21, sex: women, ...

  2. javascript创建对象的几种模式

    在js中有几种模式可以创建对象,通过对象操作所包含的属性与方法. 一般来说,构造函数名称的第一个字母为大写字母,非构造函数名称的第一个字母为小写字母,当然,构造函数与一般函数唯一的区别只是调用的方式不 ...

  3. JavaScript中创建对象的三种模式

    JS中,便于批量创建对象的三种模式: 1.工厂模式:用一个函数封装创建对象的细节,传入必要的参数,在函数内部new一个对象并返回. 缺点:创建的对象无法识别类型(全是Object) 2.构造函数模式: ...

  4. JavaScript 创建对象的七种方式

    转自:xxxgitone.github.io/2017/06/10/JavaScript创建对象的七种方式/ JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以 ...

  5. JavaScript创建对象的几种 方式

    //JavaScript创建对象的七种方式 //https://xxxgitone.github.io/2017/06/10/JavaScript%E5%88%9B%E5%BB%BA%E5%AF%B9 ...

  6. javascript创建对象的方法--原型模式

    javascript创建对象的方法--原型模式 一.总结 1.原型模式解决内存浪费的方法(继承):通过继承,对象继承原型模式下的所有属性,对象不同于其它对象的的属性自己创建或者修改 2.原型的使用(p ...

  7. Javascript 创建对象的三种方法及比较【转载+整理】

    https://developer.mozilla.org/zh-CN/docs/JavaScript/Guide/Inheritance_and_the_prototype_chain 本文内容 引 ...

  8. javascript创建对象的方法--组合模式

    javascript创建对象的方法--组合模式 一.总结 0.作用:解决原型模式对象独有属性创建麻烦的问题 1.组合模式使用普遍:jquery就是用的组合模式,组合模式使用非常普遍 2.组合模式优点: ...

  9. javascript创建对象的方法--构造函数模式

    javascript创建对象的方法--构造函数模式 一.总结 构造函数模式作用和不足 1.作用:解决工厂模式不是用new关键字来创建对象的弊端 2.作用:解决工厂模式创建的实例和模型没有内在联系的问题 ...

随机推荐

  1. iptables 执行清除命令 iptables -F 要非常小心

    使用 /sbin/iptables -F 要小心,搞不好,你就马上同服务器断开连接了 以下是来自 http://wiki.ubuntu.org.cn/IptablesHowTo 上的说明 可以通过/s ...

  2. redis持久化的方法及对比

    1.持久化的作用 redis所有的数据保持在内存中,对数据的更新将异步的保存到磁盘上. 两种方式: 2.RDB 2.1.概念 2.2.触发机制 2.2.1.save 同步 因为是同步命令,数据量大的话 ...

  3. 好的web前端是如何拿到30万年薪的?

    2018年前端开发不再像过去几年里新技术框架层出不穷,而是各种组件,模块,很多东西都有痕迹可寻,技术都在原来的基础上有了革新和沉淀. 前端招聘方面也在紧跟技术发展,大量“滥竽充数”的速成开发者开始失去 ...

  4. [libgdx游戏开发教程]使用Libgdx进行游戏开发(2)-游戏框架搭建

    让我们抛开理论开始code吧. 入口类CanyonBunnyMain的代码: package com.packtpub.libgdx.canyonbunny; import com.badlogic. ...

  5. 前端nginx后端tomcat记录真实ip

    修改nginx主配置文件:/usr/local/nginx/conf/nginx.conf proxy_set_header Host $host; proxy_set_header X-Real-I ...

  6. Java中导入导出Excel -- POI技术

    一.介绍: 当前B/S模式已成为应用开发的主流,而在企业办公系统中,常常有客户这样子要求:你要把我们的报表直接用Excel打开(电信系统.银行系统).或者是:我们已经习惯用Excel打印.这样在我们实 ...

  7. nodejs 服务器重新启动

    在 我们开发node 应用的时候,一但你的应用已经启动了,这个时候如果你修改了服务端的文件,那么要是这个修改起作用,你必须手动停止服务然后再重新启动,这在开发过程中无 疑是很烦人的一件事,最好是有一个 ...

  8. CF 612C. Replace To Make Regular Bracket Sequence【括号匹配】

    [链接]:CF [题意]:给你一个只含有括号的字符串,你可以将一种类型的左括号改成另外一种类型,右括号改成另外一种右括号 问你最少修改多少次,才能使得这个字符串匹配,输出次数 [分析]: 本题用到了栈 ...

  9. hdu6070

    hdu6070 题意 给出 \(n\) 个数, \(\frac{x}{y}\) 表示某个区间不同数的个数除以区间的长度,求 \(\frac{x}{y}\) 最小值. 分析 设 \(size(l, r) ...

  10. JVM内存溢出及配置

    一.Java JVM内存介绍 JVM管理两种类型的内存,堆和非堆.按照官方的说法:“Java 虚拟机具有一个堆,堆是运行时数据区域,所有类实例和数组的内存均从此处分配.堆是在 Java 虚拟机启动时创 ...