美文网首页
js面向对象实现面向对象(一)

js面向对象实现面向对象(一)

作者: 镜轩夕照 | 来源:发表于2019-07-06 01:22 被阅读0次

    前言

    众所周知周知,js是一个面向过程的弱类型动态语言,但是在开发的过程中为了良好的封装和功能的实现我们需要面向对象,比如静态类型方法,公有私有变量,方法,继承,多态等等,js可以用自己的“骚操作去实现”。而js的面向对象是建立在它是依靠原型链实现的。

    类和实例属性方法,私有属性方法

    new 关键词的作用,构造函数

    • 创建一个空对象,并使该空对象继承Func.prototype;
    • 执行构造函数,并将this指向刚刚创建的新对象;
    • 返回新对象
    function Super(name,age) {
      this.name= name;//实例属性
      this.age = age;
      //实例方法
      this.show = function() {
        console.log(name,age)
      }
      // 实例私有属性
      var height = 180;
      // 实例私有方法  
      function _height() {
             console.log(height)
      }   
    }
    var boy = new Super('yzg',26);
    boy.show() // yzg,26
    

    如上所示,就能给对象新建一个类Super构造函数,有实例方法和属性和私有方法属性

    静态私有属性和方法

    这里我们利用闭包的原理,返回类。就可以在闭包内建立静态属性和方法

    var Super = (function() {
          var salary = 20000; //静态私有属性
          //静态私有方法
          var showSalary = function(){
            console.log(salary)
          }
          var _Super = function(name,age) {
                     this.name= name; //实例属性
                     this.age = age;  
                     //实例方法
                     this.show = function() {
                         console.log(name,age)
                      }
                      // 实例私有属性
                    var height = 180;
                    // 实例私有方法  
                    function _height() {
                           console.log(height)
                      }   
                   }
          return _Super;
    }())
    

    实例公有方法和属性

    我们可以利用function的protptye实现公共方法和属性

    var Super = (function() {
          var salary = 20000; //静态私有属性
          //静态私有方法
          var showSalary = function(){
            console.log(salary)
          }
          var _Super = function(name,age) {
                     this.name= name; //实例属性
                     this.age = age;  
                     //实例方法
                     this.show = function() {
                         console.log(name,age)
                      }
                        // 实例私有属性
                    var height = 180;
                    // 实例私有方法  
                    function _height() {
                           console.log(height)
                      }   
                   }
         //实例公有属性  
         _Super.prototype.address='cn anhui';
         //实例公有方法  
         _Super.prototype.showAddress= function () {
                          console.log(this.address)
                       } 
          return _Super;
    }())
    

    实例公有方法和属性

    我们可以利用function的protptye实现公共方法和属性

    var Super = (function() {
          var salary = 20000; //静态私有属性
          //静态私有方法
          var showSalary = function(){
            console.log(salary)
          }
          var _Super = function(name,age) {
                     this.name= name; //实例属性
                     this.age = age;  
                     //实例方法
                     this.show = function() {
                         console.log(name,age)
                      }
                      // 实例私有属性
                     var height = 180;
                      // 实例私有方法  
                      function _show() {
                          console.log(height)
                       }   
                   }
         //实例公有属性  
         _Super.prototype.address='cn anhui';
         //实例公有方法  
         _Super.prototype.showAddress= function () {
                          console.log(this.address)
                       } 
          return _Super;
    }())
    

    静态公有方法和属性

    类似于实例的公有方法和属性,只不过这次我们是直接将属性绑定到构造函数上而不是挂在prototype上。

    var Super = (function() {
          var salary = 20000; //静态私有属性
          //静态私有方法
          var showSalary = function(){
            console.log(salary)
          }
          var _Super = function(name,age) {
                     this.name= name; //实例属性
                     this.age = age;  
                     //实例方法
                     this.show = function() {
                         console.log(name,age)
                      }
                       // 实例私有属性
                    var height = 180;
                    // 实例私有方法  
                    function _height() {
                           console.log(height)
                      }   
                   }
         //实例公有属性  
         _Super.prototype.address='cn anhui';
         //实例公有方法  
         _Super.prototype.showAddress= function () {
                          console.log(this.address)
                       } 
        //静态公有属性
        _Super.company = 'dxyt';
       //静态公有方法
       _Super.showCompany = function () {
                          console.log(this.company)
                       } 
          return _Super;
    }())
    

    相关文章

      网友评论

          本文标题:js面向对象实现面向对象(一)

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