zoukankan      html  css  js  c++  java
  • JavaScript模式读书笔记 第6章 代码复用模式

    主要使用代码继承来完成复用。
    1,使用类式继承。
        -1,类式继承:按照类的方式来实现继承,即所谓的类式。
        -2,类式继承:通过构造函数(child)获取来自parent的属性,从而创建对象。
      
    <script>
    //parent
    function Parent(name){
    this.name = name || 'Adam';
    }
    Parent.prototype.say = function(){
     
    return this.name;
    }
    //child
    function Child(name){
     
    }
    //此处实现继承,需要自己实现
    inherit(Child, Parent);
     
      </script>
        -3,默认模式
     
    //默认模式
    function inherit(C, P){
    C.prototype = new P();
    }
     
    var kid = new Child();
    console.log(kid.say());//输出Adam
        -4,借用构造函数
            借用父类构造函数,它传递子对象以绑定到this,并且还转发任意参数。
    <script>
    //父构造函数
    function Article(){
    this.tags = ['js', 'css'];
    }
    var article = new Article();
     
    function BlogPost(){
     
    }
    BlogPost.prototype = article;//获取到对应对象的一个引用
    var blog = new BlogPost();
     
    function StaticPost(){
    Article.call(this);//获取到对应对象成员的副本,相当于在本对象中生成同样的一个成员变量
    }
    var page = new StaticPost();
    console.log(article.hasOwnProperty('tags'));//true
    console.log(blog.hasOwnProperty('tags'));//false
    console.log(page.hasOwnProperty('tags'));//true
     
      </script>
        -5,借用和设置原型
         
    <script>
    function Child(a, b, c, d){
    Parent.apply(this, arguments);//通过借用获取到父类的成员变量
    }
     
    Child.prototype = new Parent();//通过此处获父类的方法
     
      </script>
      
    <script>
    function Parent(name){
    this.name = name || "Tom";
    }
    Parent.prototype.say = function(){
    return this.name;
    }
    function Child(name){
    Parent.apply(this, arguments);
    }
     
    Child.prototype = new Parent();
     
    var kid = new Child("Child");
    console.log(kid.name);//child
    console.log(kid.say());//child
    delete kid.name;
    console.log(kid.say());//Tom
     
      </script>
        -6,共享原型
    function inherit(C, P){
    C.prototype = P.prototype;
    }
    如果继承链下方的某个子类修改原型,那么会影响到所有原型链上的对象。
        -7,临时构造函数
    function inherit(C, P){
     
    var F = function(){};
    F.prototype = P.prototype;
    C.prototype = new F();
    }
        -8,Klass
           a. 都有一套关于如何命名类方法的公约。
            b. 存在从其他类所继承的类。
            c.在子类中可以访问父类或超类。
     <script>
    var klass = function(Parent, props){
    var Child, F, i;
     
    //1. 新构造函数
    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);
    }
    };
     
    //2. 继承
    Parent = Parent || Object;
    F = function(){};
     
    F.prototype = Parent.prototype;
    Child.prototype = new Child();
    Child.uber = Parent.prototype;
    Child.prototype.constructor = Child;
     
    //3.添加实现方法
    for(i in props){
    if(props.hasOwnProperty(i)){
    Child.prototype[i]= props[i];
    }
    }
     
    return Child;
     
    };
     
      </script>


    代码复用才是目的,继承只是实现这一目标的方法之一。






















    欢迎转载,但转载请注明原文链接[博客园: http://www.cnblogs.com/jingLongJun/]
    [CSDN博客:http://blog.csdn.net/mergades]。
    如相关博文涉及到版权问题,请联系本人。
  • 相关阅读:
    【风马一族_php】PHP与Mysql建立连接
    【风马一族_php】NO1_用php发出一声 Hi
    【风马一族_php】NO0_搭建web服务器
    【风马一族_mysql】mysql基本指令
    wnmp环境搭建
    appach2.4 + php7 +mysql5.7.14 配置
    常用样式
    jquery 格式化系统时间
    使用插件实现一般处理程序导出excel
    bootstrap分页
  • 原文地址:https://www.cnblogs.com/jingLongJun/p/4491077.html
Copyright © 2011-2022 走看看