优先使用对象组合,而不是类继承;

类式继承:通过构造函数Child()来获取来自于另一个构造函数Parent()的属性;

  • 默认模式:子类的原型指向父类的一个实例

    function inherit(C, P) {
    C.prototype = new P();
    } function Parent(name) {
    this.name = name || 'Adam';
    } Parent.prototype.say = function () {
    return this.name;
    } function Child() {}; inherit(Child, Parent); var kid = new Child();
    • 缺点:同时继承了两个对象的属性,效率低下;
  • 借用构造函数:之继承在父构造函数中添加到this的属性;
    function Parent(name) {
    this.name = name || 'Adam';
    }
    Parent.prototype.say = function () {
    return this.name;
    }
    function Child(name) {
    Parent.apply(this, arguments);
    }
    var kid = new Child(); //并没有继承到say方法
    • 多重继承:

      function Cat() {
      this.legs = 4;
      this.say = function () {
      return 'meaoww';
      }
      }
      function Bird() {
      this.wings = 2;
      this.fly = true;
      }
      function CatWings() {
      Cat.apply(this);
      Bird.apply(this);
      }
      var jane = new CatWings();
    • 优点:可以获取扶对象自身成员的真实副本,且不会有子对象覆盖父对象的问题;
  • 借用和设置原型:结合前两中模式,先借用构造函数,然后设置子构造函数的原型使其指向一个构造函数的实例;
    function Child(a, b, c, d) {
    Parent.apply(this, arguments);
    }
    Child.prototype = new Parent(); 

缺点:父构造函数被调用两次;

  • 共享原型: 

    function inherit(C, P) {
    C.prototype = P.prototype;
    }

    即提供了简短迅速的原型链查询,也易导致影响其他对象;

  • 临时构造函数:解决共享原型的问题

    • 基本代码:

      function  inherit(C, P) {
      var F = function () {};
      F.prototype = P.prototype;
      C.prototype = new F();
      }  
    • 存储超类:增加一个指向原始父对象的引用  

      function  inherit(C, P) {
      var F = function () {};
      F.prototype = P.prototype;
      C.prototype = new F();
      C.uber = P.prototype;
      } 
    • 重置构造函数:考虑可能会用到constructor

      function  inherit(C, P) {
      var F = function () {};
      F.prototype = P.prototype;
      C.prototype = new F();
      C.uber = P.prototype;
      C.prototype.constructor = C;
      } 
    • 优化:避免每次需要继承时都创建

      var inherit = (function () {
      var F = function () {};
      return function (C, P) {
      F.prototype = P.prototype;
      C.prototype = new F();
      C.uber = P.prototype;
      C.prototype.constructor = C;
      }
      })();
    • Klass: 模拟类的语法糖

      var klass = function (Parent, props) {
      var Child, F, i;
      //新构造函数
      Child = function () {
      if(Child.uber && Child.uber.hasOwnProperty('_construct')) {
      Child.uber._construct.apply(this, arguments);
      }
      if(Child.prototype.hasOwnProperty('_construct')) {
      Child.prototype._construct.apply(this, arguments);
      }
      }
      //继承
      Parent = Parent || Object;
      F = function() {};
      F.prototype = Parent.prototype;
      Child.prototype = new F();
      Child.uber = Parent.prototype;
      Child.prototype.constructor = Child;
      //添加实现方法
      for(i in props) {
      if(props.hasOwnProperty(i)) {
      Child.prototype[i] = props[i];
      }
      }
      //返回该Class
      return Child;
      } var Man = klass(null/*父类*/, { /*新类的实现*/
      _construct: function (what) {
      console.log("Man's constructor");
      this.name = what;
      },
      getName: function () {
      return this.name;
      }
      }); var first = new Man('Adam');
      first.getName(); var SuperMan = klass(Man, {
      _construct: function (what) {
      console.log("SuperMan's constructor");
      },
      getName: function() {
      var name = SuperMan.uber.getName.call(this);
      return "I am " + name;
      }
      }); var clark = new SuperMan('Clark kent');
      clark.getName(); console.log(clark instanceof Man);
      console.log(clark instanceof SuperMan);

        

      最好避免使用;适用于对类熟悉,对原型不熟的情况;  

       

javascript优化--08模式(代码复用)01的更多相关文章

  1. javascript优化--09模式(代码复用)02

    原型继承 ://现代无类继承模式 基本代码: var parent = { name : "Papa" } var child = object(parent); function ...

  2. javascript优化--06模式(对象)01

    命名空间: 优点:可以解决命名混乱和第三方冲突: 缺点:长嵌套导致更长的查询时间:更多的字符: 通用命名空间函数: var MYAPP = MYAPP || {}; MYAPP.namespace = ...

  3. javascript优化--10模式(设计模式)01

    单体模式:保证一个特定类仅有一个实例;即第二次使用同一个类创建新对象时,应该得到与第一个所创建对象完全相同对象: 在JS中,可以认为每次在使用对象字面量创建对象的时候,实际上就在创建一个单体: 当使用 ...

  4. javascript优化--13模式1(DOM和浏览器模式)

    注意分离: 通过将CSS关闭来测试页面是否仍然可用,内容是否依然可读: 将JavaScript关闭来测试页面仍然可以执行正常功能:所有连接是否正常工作:所有的表单是否可以正常工作: 不使用内联处理器( ...

  5. javascript优化--14模式2(DOM和浏览器模式)

    远程脚本 XMLHttpRequest JSONP 和XHR不同,它不受同域的限制: JSONP请求的可以是任意的文档: 请求的URL通常格式为http://example.js?calback=Ca ...

  6. javascript优化--07模式(对象)02

    沙箱模式: 解决空间命名模式的几个缺点: 命名空间模式中无法同时使用一个应用程序或库的两个版本运行在同一个页面中,因为两者需要相同的全局符号: 以点分割,需要输入更长的字符,解析时间也更长: 全局构造 ...

  7. javascript优化--05模式(函数)

    回调函数模式: 基本例子: var findNodes = function (callback) { ...................... if (typeof callback !== ' ...

  8. javascript优化--11模式(设计模式)02

    策略模式 在选择最佳策略以处理特定任务(上下文)的时候仍然保持相同的接口: //表单验证的例子 var data = { firs_name: "Super", last_name ...

  9. javascript优化--12模式(设计模式)03

    观察者模式 通过创建一个可观察的对象,当发生一个感兴趣的事件时将该事件通告给所有观察者,从而形成松散的耦合 订阅杂志 //发布者对象 var publisher = { subscribers: { ...

随机推荐

  1. iOS工程如何支持64-bit(转)

    苹果在2014年10月20号发布了一条消息:从明年的二月一号开始,提交到App Store的应用必须支持64-bit.详细消息地址为:https://developer.apple.com/news/ ...

  2. Firefox渗透测试黑客插件集

    前天看S哥用Firefox的hackbar进行手动注入进行渗透,觉得直接运用浏览器的插件进行渗透测试有很多优点,既可以直接在前端进行注入等操作,也可以省却了寻找各种工具的麻烦.前端还是最直接的!于是这 ...

  3. OpenCV入门(二)

    这次主要学习了下滤波,就当复习了图像处理的知识了:http://blog.csdn.net/poem_qianmo/article/details/22745559 代码实现比较简单,但关于通过滚动条 ...

  4. DCMTK354之VC++ 2008 MFC应用程序配置完整过程

    花了一个礼拜,终于在VC++2008 MFC 应用程序中完成了首个基于DCMTK354的首个程序ECHOSCUWIN32,现将过程记录下来,便于日后查阅,同时也提供给那些有幸看到此博文而对他们又有帮助 ...

  5. HDOJ 1878 欧拉回路 nyoj 42一笔画问题

    #include<cstdio> #include<cstring> ]; int find(int x) { if(visited[x]!=x) return find(vi ...

  6. Python爬虫经验

    有时候读取同一个url,服务器可能会返回不同的response,并不是爬虫程序代码的问题,而是服务器的问题,初次试验request时,最好 把response文本保存在一个txt文件当中,以便后续的比 ...

  7. MySQL Profiling 的使用

    MySQL Profiling 的使用 在本章第一节中我们还提到过通过 Query Profiler 来定位一条 Query 的性能瓶颈,这里我们再详细介绍一下 Profiling 的用途及使用方法. ...

  8. 《ASP.NET1200例》当前上下文中不存在名称configurationmanager

    当前上下文中不存在名称ConfigurationManager的解决方法 今晚做项目在DBHelper.cs类中的数据库连接要改到web.config里面调用,结果在编译的时候却发现提示错误: 当前上 ...

  9. asp.net文本编辑器FCKeditor使用方法详解

    文本编辑器的使用: 1.FCKeditor的官方网站是:http://www.fckeditor.net/download  目前最新的FCKeditor.Net_2.6.9版本. 请在此页下载:ht ...

  10. cocos2d-x 制作系统公告

    2013-12-15 21:57:33 下载地址:http://download.csdn.net/detail/jackyvincefu/6434549 (摘自:CSDN资源) CTestLayer ...