javascript模式学习

最近在看JS模式一书,越发觉得JS模式的博大精深(也可能源于它的先天残疾,哈哈),发篇博文记录一下,先是5中所谓的javascript模拟类的模式,主要实现的是继承和代码复用。

1、 默认简单模式 No1,很简单,真的很简单,不过告诉了我们一些基础知识,JS的继承其实就是讲父对象的实例绑定在子对象的prototype上而已,这种方式的优缺点如下:

优点在于:可以简单的继承属性和方法

缺点在于:1、同时继承两个对象属性--添加到this的属性和原型的属性,在很多时候有些属性是不需要的。2、每次都会重新创建父对象。

  具体代码如下

(function() {
                  var Parent = function(name) {
                           this.name = name || 'wf';
                           
                           Parent.prototype.say = function() {
                                    return 'saying...' + this.name;
                           }
                  }   
                  var Child = function() {}
                  
                  // inherit key code
                  Child.prototype = new Parent();
                  
                  // No 1 test
                  var kid = new Child();
                  console.log('kid.name==' + kid.name);
                  console.log('kid.say==' + kid.say());            
        })();
2、借用构造函数模式 NO2,顾名思义,所谓借用构造函数,是指子对象的构造函数中通过call(apply)的形式,调用了父对象的构造函数,已达到将参数传递给父对象构造函数的目的。

优点在于:1、可以通过借用构造函数实现多重继承,2、可以获得父对象的真实副本,从而不必担心修改子对象会影响到父对象的属性

缺点在于:此模式无法从原型中继承任何父对象的属性或方法,因为借用构造函数,子对象的__proto__指针并没有真正的指向父对象

具体代码如下:

    

        (function() {

          var Parent = function(name) {

              this.name = name || 'wf';

      

            Parent.prototype.say = function() {

                      return 'saying...' + this.name;

                      }

          }

                  

          var Child = function(name) {

                // inherit key code

                Parent.call(this, arguments);

// we can inherit another obj here

// Parent2.call(this, arguments);

           }

          

           // No 2 test

           var kid = new Child('sheep');

           console.log(kid.hasOwnProperty('name'));

           console.log(Parent.hasOwnProperty('name'));

           console.log(kid.say);  

        })();


   

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值