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

前面已经提到,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. HDU 4857 (反向拓扑排序 + 优先队列)

    题意:有N个人,M个优先级a,b表示a优先于b.而且每一个人有个编号的优先级.输出顺序. 思路来自:与PKU3687一样 在主要的拓扑排序的基础上又添加了一个要求:编号最小的节点要尽量排在前面:在满足 ...

  2. HW Video Acceleration in Chrome/Chromium HTML5 video 视频播放硬件加速

    Introduction Video decode (e.g. YouTube playback) and encode (e.g. video chat applications) are some ...

  3. java jquery 函数多參数传递

    业务需求: 名次   伙伴 业绩 签单 面谈 每日目标 1 文彬 5100 6 10 查看目标 2 马红月 4550 4 6 查看目标 3 王刚 4100 3 9 查看目标 4 郭亚凯 3450 4 ...

  4. Songs

    Two Steps From Hell - Strength of a Thousand Men

  5. http调试工具Charles Proxy用法详解

    Charles Proxy 通常称为Charles,Charles是目前最强大的http调试工具,在界面和功能上远强于Fiddler,同时是全平台支持,堪称圣杯级工具,不过在这里为您提供了Charle ...

  6. stm32 ARM中的RO、RW和ZI DATA

    一直以来对于ARM体系中所描述的RO,RW和ZI数据存在似是而非的理解,这段时间对其仔细了解了一番,发现了一些规律,理解了一些以前书本上有的但是不理解的东西,我想应该有不少人也有和我同样的困惑,因此将 ...

  7. 使用HtmlAgilityPack批量抓取网页数据

    原文:使用HtmlAgilityPack批量抓取网页数据 相关软件点击下载登录的处理.因为有些网页数据需要登陆后才能提取.这里要使用ieHTTPHeaders来提取登录时的提交信息.抓取网页  Htm ...

  8. 关于JAVA Project.waitfor()返回值是1

    Project.waitfor()返回值是1,找了很久从网上没有发现关于1的说明. 这时对源代码调试了一下,发现Project=null.而去根目录下点击被调用的bat文件发现也可以被正确执行. 这时 ...

  9. g++编C++11/C++0x遇到的问题

    在看<Cplusplus Concurrency In Action Practical Multithreading>当遇到第一个样品: #include<iostream> ...

  10. loj1201(最大独立集)

    传送门:A Perfect Murder 题意:有一群苍蝇,之间有一些是朋友关系,如果杀了一只苍蝇,那么它的朋友们都会有警惕性,再也杀不了这些朋友了,问最多能杀多少只苍蝇. 分析:根据朋友性连边,最多 ...