代码复用模式

1)使用原型继承
           函数对象中自身声明的方法和属性与prototype声名的对象有什么不同:
     自身声明的方法和属性是静态的, 也就是说你在声明后,试图再去增加新的方法或者修改已有的方法,
     并不会由其创建的对象产生影响,也即继承失败。
     而prototype可以动态地增加新的方法或者修改已有的方法, 从而是动态的,一旦父函数对象声明了相关的prototype属性,由其创建的对象会自动继承这些prototype的属性。
 
      既然有函数对象本身的属性, 也有prototype的属性, 那么是由其创建的对象是如何搜索相应的属性的呢?
      基本是按照下面的流程和顺序来进行:
     1 先去搜索函数对象本身的属性,如果找到立即执行
     2 如果1没有找到,则会去搜索prototype属性,有2种结果,找到则直接执行,否则继续搜索父对象的父对象的prototype,
     直至找到,或者到达prototype chain 的结尾(结尾会是Object对象)
     上面也回答如果函数对象本身的属性与prototype属性相同(重名)时的解决方式, 函数本身的对象优先。
    实例:
  1. function Employee(name)
  2. {
  3. this.name = "";
  4. this.dept = "general";
  5. this.gender = "unknown";
  6. }
  7. function WorkerBee()
  8. {
  9. this.projects = [];
  10. this.hasCar = false;
  11. }
  12. WorkerBee.prototype = new Employee; // 第一层prototype链
  13. function Engineer()
  14. {
  15. this.dept = "engineer"; //覆盖了 "父对象"
  16. this.language = "javascript";
  17. }
  18. Engineer.prototype = new WorkerBee; // 第二层prototype链
  19. var jay = new Engineer("Jay");
  20. if (flag)
  21. {
  22. alert(jay.dept); //engineer, 找到的是自己的属性
  23. alert(jay.hasCar); // false, 搜索到的是自己上一层的属性
  24. alert(jay.gender); // unknown, 搜索到的是自己上二层的属性
  25. }
2)使用Object.create继承对象
  ECMAScript5也提供了类似的一个方法叫做Object.create用于继承对象。
      实例:  
  1. var parent = {
  2. name : "张三"
  3. };
  4. /* 使用新版的ECMAScript 5提供的功能 */
  5. var child = Object.create(parent, {
  6. age : {
  7. value : 2
  8. },
  9. sex : {
  10. value : '男'
  11. }
  12. });
  13. console.log("child.age.value: " + child.age + "-----sex: " + child.sex);
  14. //child.age.value: 2-----sex: 男

3)使用Object.defineProperty(可以更细粒度的对新增的属性进行配置设置)
      语法:
      Object.defineProperty(obj, prop, descriptor)
      参数:
     obj:目标对象
     prop:需要定义的属性或方法的名字。
     descriptor:目标属性所拥有的特性。
     可供定义的特性列表:
     value:属性的值
     writable:如果为false,属性的值就不能被重写。
     get: 一旦目标属性被访问就会调回此方法,并将此方法的运算结果返回用户。
     set:一旦目标属性被赋值,就会调回此方法。
     configurable:如果为false,则任何尝试删除目标属性或修改属性以下特性(writable,   configurable, enumerable)的行为将被无效化。
     enumerable:是否能在for...in循环中遍历出来或在Object.keys中列举出来。
     实例:  
  1. var foo = {x:10};
  2. Object.defineProperty(foo, "y", {
  3. value:20,
  4. writable: false,//只读
  5. configurable: false, //不可配置
  6. enumerable: true
  7. });
  8. console.log(foo.y); //20
 4)通过call或apply方法
      方法定义   
     call方法:
     语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])
     定义:调用一个对象的一个方法,以另一个对象替换当前对象。
     说明:
     call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。
     如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。
 
     apply方法:
     语法:apply([thisObj[,argArray]])
     定义:应用某一对象的一个方法,用另一个对象替换当前对象。
     说明:
     如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。
     如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。
 
    说明:call, apply,这两个方法基本上是一个意思,区别在于 call 的第二个参数可以是任意类型,而apply的第二个参数必须是数组,也可以是arguments
     实例: 
  1. function Animal(name){
  2. this.name = name;
  3. this.showName = function(){
  4. alert(this.name);
  5. }
  6. }
  7. function Cat(name){
  8. Animal.call(this, name);
  9. }
  10. var cat = new Cat("Black Cat");
  11. cat.showName(); //Black Cat
  12. //Animal.call(this) 的意思就是使用 Animal对象代替this对象,那么 Cat中不就有Animal的所有属性和方法了
  13. //此时Cat对象就能够直接调用Animal的方法以及属性了.

javascript-代码复用模式的更多相关文章

  1. javascript代码复用模式(二)

    前面说到,javascript的代码复用模式,可分为类式继承和非类式继承(现代继承).这篇就继续类式继承. 类式继承模式-借用构造函数 使用借用构造函数的方法,可以从子构造函数得到父构造函数传任意数量 ...

  2. javascript代码复用模式

    代码复用有一个著名的原则,是GoF提出的:优先使用对象组合,而不是类继承.在javascript中,并没有类的概念,所以代码的复用,也并不局限于类式继承.javascript中创建对象的方法很多,有构 ...

  3. javascript代码复用模式(三)

    前面谈到了javascript的类式继承.这篇继续部分类式继承,及一些现代继承. 类式继承模式-代理构造函数 这种模式通过断开父对象与子对象之间原型之间的直接链接关系,来解决上次说到的共享一个原型所带 ...

  4. 《JavaScript模式》第6章 代码复用模式

    @by Ruth92(转载请注明出处) 第6章:代码复用模式 GoF 在其著作中提出的有关创建对象的建议原则: -- 优先使用对象组合,而不是类继承. 传统模式:使用类继承: 现代模式:"类 ...

  5. 深入理解JavaScript系列(46):代码复用模式(推荐篇)

    介绍 本文介绍的四种代码复用模式都是最佳实践,推荐大家在编程的过程中使用. 模式1:原型继承 原型继承是让父对象作为子对象的原型,从而达到继承的目的: function object(o) { fun ...

  6. 《JavaScript 模式》读书笔记(6)— 代码复用模式2

    上一篇讲了最简单的代码复用模式,也是最基础的,我们普遍知道的继承模式,但是这种继承模式却有不少缺点,我们下面再看看其它可以实现继承的模式. 四.类式继承模式#2——借用构造函数 本模式解决了从子构造函 ...

  7. 深入理解JavaScript系列(45):代码复用模式(避免篇)

    介绍 任何编程都提出代码复用,否则话每次开发一个新程序或者写一个新功能都要全新编写的话,那就歇菜了,但是代码复用也是有好要坏,接下来的两篇文章我们将针对代码复用来进行讨论,第一篇文避免篇,指的是要尽量 ...

  8. javascript代码复用(四)-混入、借用方法和绑定

    这篇继续说js的现代复用模式:混入.借用方法和绑定. 混入 可以针对前面提到的通过属性复制实现代码复用的想法进行一个扩展,就是混入(mix-in).混入并不是复制一个完整的对象,而是从多个对象中复制出 ...

  9. 《JavaScript 模式》读书笔记(6)— 代码复用模式3

    我们之前聊了聊基本的继承的概念,也聊了很多在JavaScript中模拟类的方法.这篇文章,我们主要来学习一下现代继承的一些方法. 九.原型继承 下面我们开始讨论一种称之为原型继承(prototype ...

  10. javascript代码复用--继承

    由于javascript没有类的概念,因此无法通过接口继承,只能通过实现继承.实现继承是继承实际的方法,javascript中主要是依靠原型链要实现. 原型链继承 原型链继承是基本的继承模式,其本质是 ...

随机推荐

  1. 어느 도시 보유 하 면 사랑 이다(事態が発生すれば、ある都市の恋はしません)【Si les villes un amour】{If have love in a city}

    如果在北京拥有爱情 半夜在簋街喝啤酒 吃小龙虾 在后海的苦情歌声里 搂着你数那四合院的瓦片 如果在上海拥有爱情 去外滩手挽手 吹吹风 坐一下午 去城隍庙尝试各种小吃 嘲笑你嘴角残余的糯米糕 如果在杭州 ...

  2. centos7下载安装谷歌浏览器

    centos7安装完成结束后,发现自带的火狐浏览器不太习惯,自己还是习惯谷歌浏览器,因为是新手嘛,所以自己就各种找教程看如何下载安装谷歌浏览器,一个一个按照教程试验,终于最后试验成功了一个,亲测可用. ...

  3. CCLablettf读取显示xml文件内容显示中文

    CCDictionary *strings = CCDictionary::createWithContentsOfFile("tips2.xml"); const char *h ...

  4. 用js对象创建链表

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

  5. h2database源码浅析:事务、两阶段提交

    Transaction Isolation Transaction isolation is provided for all data manipulation language (DML) sta ...

  6. Windows Azure入门教学:使用Blob Storage

    对于.net开发人员,这是一个新的领域,但是并不困难.本文将会介绍如何使用Blob Storage.Blob Storage可以看做是云端的文件系统.与桌面操作系统上不同,我们是通过REST API来 ...

  7. Sqlserver 安装

    安装环境: SqlServer版本:Sql Server 2008 (安装包您应该已有准备) =============以下开始安装,多图,基本软件操作不做太多说明,注意查看图片=========== ...

  8. ubuntu中安装monodevelop

    sudo apt-get install monoDevelop sudo apt-get install build-essentialsudo apt-get install mono-devel ...

  9. (七)Hibernate 映射继承

    所有项目导入对应的hibernate的jar包.mysql的jar包和添加每次都需要用到的HibernateUtil.java 第一节:每个具体类对应一个表 Image.java package co ...

  10. iOS夯实:ARC时代的内存管理

    iOS夯实:ARC时代的内存管理 文章转自 ARC时代的内存管理 什么是ARC Automatic Reference Counting (ARC) is a compiler feature tha ...