美文网首页
js面向对象的几种写法

js面向对象的几种写法

作者: nzjcnjzx | 来源:发表于2019-07-23 11:06 被阅读0次

    一、工厂模式

    function person (name,age,job){
       var o={};//定义o这个对象
       o.name=name;
       o.age=age;
       o.job=job;
       o.sayName=function(){
          console.log(this.name);
             }  
         return o;
    
    }
    
    
     var demo=person('tj',22,'fe');
    
     console.log(demo);
    

    二、构造函数模式

    function Person(name,age){   //构造函数以大写字母开头,普通函数以小写字母开头
         this.name=name;
         this.age=age;
         this.sayName=function(){
                console.log(this.name)
       };
    }
    
     var demo2=new Person('tj2',23)
    
       console.log(demo2)
     }
     使用构造函数有一些注意点:必须使用new操作符,调用构造函数会经历以下四步:
    
         1、创建一个新的对象
    
         2、将构造函数的作用域给了新对象(this指向新对象),其中this 是全局变量,window.age  获取的结果是一样的。
    
         3、对新对象添加属性
    
         4、返回新对象
    

    三、原型模式

    function Person(){  }
       
     Person.prototype.name ='tj3';
     Person.prototype.age=24;
     Person.prototype.sayName= function(){
         alert(this.name)
    
    }
    
     var demo3= new Person();
     console.log(demo3);
    
    //更简单的原型办法
       
      function Person(){
      }
    
      Person.prototype={
         name:'tj4',
         age:25,
         sayName:function(){
           alert(this.name)
       }
    };
    
      var demo4=new Person();
      console.log(demo4);
    
    

    四、组合使用构造函数和原型模式

    function Person(name,age,job){
              this.name=name;
              this.age=age;
              this.job=job;
              this.sayName=function(){
                alert(this.name)
           }
         }
    
       Person.prototype ={
             sayJob:function(){
                console.log(this.job);
            }
         }
    
    
        var person1=new Person('tj',22,'fe');
    

    五、原型链继承

     原型链继承的主要思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。
    
          注意点:通过原型链继承是不能使用对象字面量创建原型方法,这样会重写原型链!
    function SuperType(){
          this.color=['red','blue'];
           }
          
        function SubType(){
    
      }
    
      SubType.prototype=new SuperType();//继承了SuperType
    
        var instance1=new SubType();
           console.log(instance1);
    

    六、借用构造函数继承

    function wanda(){
         this.money=[1,2,3]
       }
    
       function sicong(){
           wanda.call(this);
        }
    
       var sc = new sicong();
        sc.money.push(666)
        console.log(sc)
    

    七、组合继承

    function SuperType(name) {
            this.name = name;
            this.color = ['red', 'blue'];
        }
        SuperType.prototype.sayName = function() {
            console.log(this.name);
        };
        function SubType(name, age) {
            SuperType.call(this, name);//继承属性
            this.age = age;
        }
        SubType.prototype = new SuperType();//继承方法
        var instance1 = new SubType('tj', 22);
        instance1.sayName();
    

    相关文章

      网友评论

          本文标题:js面向对象的几种写法

          本文链接:https://www.haomeiwen.com/subject/excolctx.html