问一、引入工厂,解决反复代码

前面已经提到,JS中创建对象的方法,不难发现,主要的创建方法中,创建一个对象还算简单,假设创建多个类似的对象的话就会产生大量反复的代码。

解决:工厂模式方法(加入一个专门创建对象的方法,传入參数避免反复)

         function createObject(name,age){
var obj =new Object(); //创建对象
obj.name = name;
obj.age = age;
obj.run = function(){
return this.name + this.age + '处理中...';
};
return obj; //返回对象引用
};

问二、引入构造函数,解决对象识别

上面方法尽管攻克了避免反复代码出现的问题,但也带来了无法识别详细对象的问题,方法内部使用new
Object的方式,最后返回该对象引用,调用该方法创建的对象返回的所有都是Object的引用,因此使用typeof或instanceof操作符时都无法区分详细对象。

解决:构造函数(改良后的工厂方法)

         function Box(name,age){    //创建对象
this.name = name;
this.age = age;
this.run = function(){
return this.name + this.age + '处理中...';
};
};

比較:细心的童鞋就该发现了,该方法与问一中的工厂模式不同之处就在于:省略了newObject()的明文运行过程;省略了return语句,这些都由后台自己主动运行。

而构造函数差别普通函数的地方在于其调用方式,必须用new运算符或对象冒充方式调用。

问三、引入prototype属性对象,解决对象之间的共享问题

每个对象都会有一个prototype,同一时候它也是一个对象。使用目的是为了解决共享问题,调用同一个构造函数创建的该对象会共享prototype中的属性和方法。

解决:使用原型模式解决共享

         function Box() {} //声明一个构造函数
Box.prototype.name = 'Lee'; //在原型里加入属性
Box.prototype.age = 100;
Box.prototype.run = function () { //在原型里加入方法
return this.name + this.age + '处理中...';
};

比較:

构造函数创建

使用原型创建

细节:在调用属性或方法时,採用就近原则,先查找实例中是否存在,否的话查找原型,可使用isPrototypeOf(),hasOwnPrototy(),in操作符进行相关測试。

问四、使用组合,解决共享及传參

原型模式创建对象省略了构造函数传參初始化的过程,这既是它的缺点又是它的长处,缺点是对象初始化的值一样,而且假设原型属性中包括有引用类型,则对一个对象进行更改,其它对象的相应属性也会跟着更改了。

解决:组合构造函数+原型模式(解决共享和传參的问题)

         function Box(name, age) {          //不共享的使用构造函数
this.name = name;
this.age = age;
this. family = ['父亲', '母亲', '妹妹'];
};
Box.prototype = { //共享的使用原型模式
constructor : Box,
run : function () {
return this.name + this.age + this.family;
}
};

细节:这样的方式事实上就是将构造函数与原型一起使用,对要创建的对象分析,将须要共享的内容放入原型中,不须要的则放在构造函数里。这样也就是组合了。

优化:这样分开式的写法难免有些怪异,我们将这两部分合并

动态原型模式(第一次调用共享方法时进行初始化原型,以后就不会初始化了)

         function Box(name ,age) { //将全部信息封装到函数体内
this.name = name;
this.age = age;
if (typeof this.run != 'function') {//仅在第一次调用的初始化
Box.prototype.run = function () {
return this.name +this.age + '处理中...';
};
}
}

中结:

在学习JS中,还是非常须要对正统面向对象语言的理解的,在这里我们学习了使用构造函数以及原型来创建对象,理解了二者的概念,对于后面的JS中面向对象深入学习会非常有帮助,各种不同的创建方式是为了解决不同情况的问题,理解了这些才干按需使用。

JS学习笔记-OO疑问之对象创建的更多相关文章

  1. JS学习笔记-OO疑问之封装

    封装是面向对象的基础,今天所要学习的匿名函数与闭包就是为了实现JS的面向对象封装.封装实现.封装变量,提高数据.系统安全性,封装正是面向对象的基础. 一.匿名函数 即没有名字的函数,其创建方式为 fu ...

  2. JS学习笔记-OO创建怀疑的对象

    问了.工厂介绍,解决重码 前面已经提到,JS中创建对象的方法.不难发现,主要的创建方法中,创建一个对象还算简单,假设创建多个类似的对象的话就会产生大量反复的代码. 解决:工厂模式方法(加入一个专门创建 ...

  3. JS学习笔记(三) 对象

    参考资料: 1. http://www.w3school.com.cn/js/js_objects.asp ☂ 知识点: ☞ Javascript中的所有事物都是对象. ☞ Javascript是基于 ...

  4. JS学习笔记 等于和包装对象

    严格等于 a===b 首先判断两边数据的类型,若类型不同,返回false. 若类型相同(1.2和1.2,字符串相等指内容和长度都是一样的),返回true null===null undefined== ...

  5. JS学习笔记10之Math对象

    -->Math对象 常用属性和方法-->使用Math对象制作相应的效果 Math对象用于执行数学任务 一.Math对象的属性: 二.Math对象的方法: 三.常用属性和方法: Math.P ...

  6. WebGL three.js学习笔记 法向量网格材质MeshNormalMaterial的介绍和创建360度全景天空盒的方法

    WebGL学习----Three.js学习笔记(5) 点击查看demo演示 Demo地址:https://nsytsqdtn.github.io/demo/360/360 简单网格材质 MeshNor ...

  7. WebGL three.js学习笔记 创建three.js代码的基本框架

    WebGL学习----Three.js学习笔记(1) webgl介绍 WebGL是一种3D绘图协议,它把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的 ...

  8. JS 学习笔记--9---变量-作用域-内存相关

    JS 中变量和其它语言中变量最大的区别就是,JS 是松散型语言,决定了它只是在某一个特定时间保存某一特定的值的一个名字而已.由于在定义变量的时候不需要显示规定必须保存某种类型的值,故变量的值以及保存的 ...

  9. JS学习笔记5_DOM

    1.DOM节点的常用属性(所有节点都支持) nodeType:元素1,属性2,文本3 nodeName:元素标签名的大写形式 nodeValue:元素节点为null,文本节点为文本内容,属性节点为属性 ...

随机推荐

  1. VC实现文件拖拽OnDropFiles

    文章转自http://blog.csdn.net/zamaolangzi/article/details/5645284 使用过QQ的人都知道,只要把文件拖拽到消息框中就可以传送文件了.那么这种功能是 ...

  2. 基于MMSeg算法的中文分词类库

    原文:基于MMSeg算法的中文分词类库 最近在实现基于lucene.net的搜索方案,涉及中文分词,找了很多,最终选择了MMSeg4j,但MMSeg4j只有Java版,在博客园上找到了*王员外*(ht ...

  3. c#(winform,webform通用)利用npoi将xls文件复制为xlsx文件(excel的修改,保存,包括excel2003-office2007+的处理)

    1.程序界面 每次需要处理excel文件的时候,都是去百度找方案,真是气一头火,今天好好总结一下,下次就不用度娘了. 我是用winform来试验的,因为winform比较方便测试,实际上只要是在.ne ...

  4. RobotFrameWork(十一)AutoItLibrary测试库在win7(64bit)下安装及简单使用

    最近安装AutoItLibrary,发现在win7 x64下无法安装成功,后来经过定位,发现是3rdPartyTools\AutoIt目录下面AutoItX3.dll的问题.因为AutoItX3.dl ...

  5. uva 10602 Editor Nottoobad(排序)

    题目连接:10602 Editor Nottoobad 题目大意:要输入n个单词,现在有三种操作, 1.输入一个字符,需要按下一次按键.  2.通过声控删除一个字符.3.通过声控复制一遍上面的单词.现 ...

  6. Tengine中的proxy_upstream_tries

    upsream xxx { server 192.168.100.100; server 192.168.100.101; server 192.168.100.102; } server { loc ...

  7. java android面试题分析总结

    本文参考多处,一并感谢! http://www.blogjava.net/fanyingjie/archive/2007/06/27/126467.aspx http://baike.baidu.co ...

  8. 得到一个div下 特定ID的所有标签

    比如说得到 <div id="showsp"> <div id="a"></div> <div id="a& ...

  9. jquery怎么在点击li标签之后添加一个在class,点击下一个li时删除上一个class?

    思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class. 具体演示如下: 1.HT ...

  10. boost库在工作(33)网络服务端之三

    在这个例子里,表示服务器与一个客户端的沟通渠道,就是一个连接,封装为类CConnect.它是当服务器接收到一个客户端连接请求之后创建的,主要用来就是管理这个连接的生命周期,以及数据的接收和发送.从生命 ...