创建js对象可以使用多种模式,每种模式有着不同的特点:如下:

1.工厂模式:创建一个函数,在函数中实例化一个对象,当每次调用函数时,就实例化一个对象,并返回这个对象;

我们知道,对象是引用形式的,每次实例化一个对象,就是在内存中开辟一个内存空间,所以每次实例化出来的内存空间是不一样的

一旦执行完调用,就是一个返回一个新对象,和原先调用的函数对象没有关系了

 1   <script>
2 function createPeraon(name, age, job) {
3 var o = new Object();
4 o.name = name;
5 o.age = age;
6 o.job = job;
7 o.sayName = function() {
8 console.log(this.name);
9 }
10 return o;
11 }
12
13 var person1 = createPeraon('huanying2015', 25, '程序员工程师');
14 var person2 = createPeraon('aluoha', 26, '架构师');
15 person1.sayName();
16 person2.sayName();
17 </script>

备注:解决了创造多个相似对象的问题

2. 构造函数模式:

函数也是对象,创建一个函数,然后对这个函数的属性和方法进行设置。当需要新对象时,直接实例化这个对象函数,在实例化的时候,一起初始化必要属性,这样,就生成了一个新的对象,构造函数的属性和方法在实例化的新对象中都有,只是对参数进行了初始化

构造函数中,没有返回值

所以,构造函数要想创建新对象,就需要使用 new  来调用

 1  <script>
2 function Person(name, age, job) {
3 this.name = name;
4 this.age = age;
5 this.job = job;
6 this.sayName = function() {
7 console.log(this.name);
8 }
9 }
10 var aa = Person('nanna', 18, '学生');
11 console.log(aa); // undefined 没有返回值
12 var person1 = new Person('huanying2015', 25, '程序员工程师');
13 var person2 = new Person('aluoha', 26, '架构师');
14 person1.sayName();
15 person2.sayName();
16 </script>

备注:构造函数的问题,是每个方法都要在实例上重新创建一遍,这样就会造成很多浪费

3.原型模式:

我们把对象的属性和方法都放到函数原型上,这样,在调用的时候,不必重新创建属性和方法,直接就可以调用了;

原型上的属性和方法可以实现共享

 1     <script>
2 function Person() {};
3 Person.prototype.name = "huanying2015";
4 Person.prototype.age = 25;
5 Person.prototype.job = "架构师";
6 Person.prototype.sayName = function() {
7 console.log(this.name);
8 }
9 var person1 = new Person();
10 person1.sayName();
11 var person2 = new Person();
12 person2.sayName();
13 console.log(person1.sayName == person2.sayName)
14 </script>

备注:缺点:引用类型的属性如果进行修改,会影响其它实例的结果,因为都指向同一个内存空间

4.构造+原型模式

综合构造和原型模式:把私有属性和方法放在构造函数中,把共有属性和方法放在原型中,这样,私有属性和方法的修改,只会影响操作对象的本身,不会对其他实例造成影响

 1   <script>
2 function Person(name, age, job) {
3 this.name = name;
4 this.age = age;
5 this.job = job;
6 this.friends = ['hali', 'jack'];
7 }
8 Person.prototype = {
9 constructor: Person,
10 sayName: function() {
11 console.log(this.name);
12 }
13 }
14
15 var person1 = new Person('huanying2015', 25, '首席架构师');
16 var person2 = new Person('aluoha', 27, '常务事务官');
17
18 person1.sayName();
19 person2.sayName();
20 console.log(person1.sayName == person2.sayName);
21 person1.friends.push('zhangsan');
22
23 console.log(person1.friends);
24 console.log(person2.friends);
25 </script>

5. 动态原型模式:

把所有信息都封装在构造函数中,通过在构造函数中初始化原型(在必要的情况下),又保持了同时使用构造函数和原型的优点。即可以通过先检查某个方法是否 存在有效,来决定是否需要初始化原型

 <script>
function Person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.friends = ['hali', 'jack'];
if (typeof this.sayName != "function") {
Person.prototype.sayName = function() {
console.log(this.name);
}
}
} var person1 = new Person('huanying2015', 25, '首席架构师');
var person2 = new Person('aluoha', 27, '常务事务官'); person1.sayName();
person2.sayName();
console.log(person1.sayName == person2.sayName);
</script>

6.寄生构造函数模式:

 1     <script>
2 function Person(name, age, job) {
3 var o = new Object();
4 o.name = name;
5 o.age = age;
6 o.job = job;
7 o.sayName = function() {
8 console.log(this.name);
9 }
10 return o;
11 }
12
13 var person1 = new Person('huanying2015', 25, '首席架构师');
14 person1.sayName();
15 </script>

这里:和工厂模式类似,只是使用new 来调用。引申一下,如下:

 1    <script>
2 function Person() {
3 var values = new Array();
4 values.push.apply(values, arguments); // 借用数组的方法,将arguments 压入数组对象中
5 values.toPipedString = function() { // 数组对象的方法
6 return this.join("---->");
7 }
8 return values;
9 }
10
11 var person1 = new Person('huanying2015', 25, '首席架构师');
12 console.log(person1.toPipedString());
13 </script>

备注:返回的对象与构造函数,及构造函数的原型之间,没有任何关系,所以,不能使用instanceof 操作符来确定对象类型

7.稳妥构造函数模式:(这里没有搞懂,是瞎写的,以后再来修改)

稳妥构造模式遵循与寄生构造模式类似的模式,也有不同:1.新创建对象的方法,不引用this;2.不使用构造函数调用构造函数

 1   <script>
2 function Person(name, age, job) {
3 var o = new Object();
4 o.name = name;
5 o.age = age;
6 o.job = job;
7 o.sayName = function() {
8 console.log(name);
9 }
10 return o;
11 }
12
13 var person1 = Person('huanying2015', 25, '首席架构师');
14 person1.sayName();
15 </script>

js 对象创建设计模式的更多相关文章

  1. JS对象创建的几种方式整理

    ​ 本文主要介绍了JS对象创建的几种方式 第一种:Object构造函数创建 var Person = new Object(); Person.name = 'Nike'; Person.age = ...

  2. JS对象创建模式

    JS的对象创建模式 1.Object构造函数模式 var person = new Object(); person.name = 'name'; person.age = 43; console.l ...

  3. JS对象创建常用方式及原理分析

    ====此文章是稍早前写的,本次属于文章迁移@2017.06.27==== 前言 俗话说"在js语言中,一切都对象",而且创建对象的方式也有很多种,所以今天我们做一下梳理 最简单的 ...

  4. JS对象创建的几种方法

    最近一直在看JS高级程序设计这本书,有空来梳理一下几种创建对象的方式.话不多说,直接步入正题. 第一种:Object构造函数创建 var Person = new Object(); Person.n ...

  5. 用js对象创建链表

    //以下是一个链表类 function LinkedList(){ //Node表示要加入列表的项 var Node=function(element){ this.element=element; ...

  6. js学习(六)- js对象创建

    //---------------------js文件--------------------- var namespace02=new Object(); namespace02.Person=fu ...

  7. JS——对象创建

    1.原始创建 <script> person = new Object();//不要var person.firstname = "Bill"; person.last ...

  8. 浅谈Js对象的概念、创建、调用、删除、修改!

    一.我们经常困惑,对象究竟是什么,其实这是一种思维,一种意识上的东西,就像我们都说    世界是有物质组成的道理一样,理解了下面的几句话!对象也不是那么抽象!    1.javascript中的所有事 ...

  9. 在这个看脸的世界,该如何优雅的创建JS对象

    Javascript是一门解释型的语言,是基于对象的,严格来说并不怎么符合的面向对象的标准,显著的特点就是函数就是“一等对象”,与传统的面向对象语言不同的时,Javascript有“一千种”方法来创建 ...

随机推荐

  1. android手机截屏、录屏

    1. 手动截屏,通过其他第三方软件发送截图,或者从手机取出截图 2. 使用命令截图,将截图保存到手机,再拉取到电脑 #!/bin/sh #运行 sh screenshot name picName=$ ...

  2. 数据库的ds命令

    Mysqi      数据库: 理一下数据库的格式: mysqi 关系型数据库,(表的概念) node.js 非关系性数据库  (json) 结构:数据库存放多张表,每个表可以存放多个字段,每个字段可 ...

  3. Jmeter(九)JDBC连接池

    JDBC为java访问数据库提供通用的API,可以为多种关系数据库提供统一访问.因为SQL是关系式数据库管理系统的标准语言,只要我们遵循SQL规范,那么我们写的代码既可以访问MySQL又可以访问SQL ...

  4. hadoop ha环境下的datanode启动报错java.lang.NumberFormatException: For input string: "10m"

    hadoop ha环境启动start-dfs.sh的时候datanode启动不了,并且报错. [hadoop@datanode2 ~]$ cat /home/hadoop/hadoop-2.7.3/l ...

  5. Glow 效果材质

    转自:http://blog.csdn.net/panda1234lee/article/details/60960846 算法较简单,首先来看 Base color 部分: 就是将对事先准备好的三张 ...

  6. sshd服务安装

    SSHD服务 介绍:SSH 协议:安全外壳协议.为 Secure Shell 的缩写.SSH 为建立在应用层和传输层基础上的安全协议. 作用:sshd服务使用SSH协议可以用来进行远程控制, 或在计算 ...

  7. Jquery ajax回调函数不执行

    ajax如下: $.post( "${pageContext.request.contextPath}/deptHead_assign.action", {"studen ...

  8. java入门简介

    1.java运行环境 下载的jdk中包含了java运行时的环境(JRE),JRE又包含了java虚拟机(JVM) 2.java运行过程 源文件(.java)由编译器编译为字节码(.class)文件,再 ...

  9. 05 Linux系统下的用户以及用户权限管理(权限管理介绍、用户管理、常见命令介绍)

    这一节我们介绍Linux的用户以及权限管理的前半段,包括:1.权限管理介绍: 2.用户管理: 3.常见命令 权限管理介绍 权限管理: 为了访问计算机资源,我们需要对其进行授权才能访问,根据什么东西来进 ...

  10. Android数据传递,使用广播BroadcastReceiver;

    Android数据传递有很多种,Intent意图传递或使用Bundle去传递,接口监听回调传递数据,也可以把数据保存起来,使用的时候去读取等等等...,"当你知道足够多的数据传递的方式之后, ...