• js中的封装、继承、多态


    Javascript是一门解释型的语言,是基于对象的,并不是真正的面向对象的语言,对变量类型的应用也是宽松的,其实它同样可以模拟面向对象的功能:

     1 function myfun1(){
     2     //这是私有属性
     3     var private1 = "这是私有属性";
     4     var privateMethod = function(){
     5         alert(private1);
     6     }
     7     //这是实例属性
     8     this.publicvar = "这是实例属性";
     9     this.public1 = function(){
    10         privateMethod();
    11     }
    12 }
    1 var newfun1 = new myfun1();
    2 newfun1.public1(); //这是私有属性
    3 alert(newfun1.publicvar);//这是实例属性
    4 alert(newfun1.private1); // undefined   newfun1.privateMethod(); //运行错误
    1 function myfun2(){
    2 }
    3 myfun2.staticvar = "这是静态属性";
    4 myfun2.staticmethod = function(){
    5     alert(myfun2.staticvar);
    6 }
    7 var newfun2 = new myfun2();
    8 //newfun2.staticmethod();//运行错误;
    9 alert(newfun2.staticvar);//undefined
     
     
     1 //静态私有成员
     2 var myfun3 = (function(){
     3     function privateProperty(){
     4     
     5     }
     6     privateProperty.staticvar = "这是静态私有成员";
     7     privateProperty.staticmethod = function(){
     8         alert(privateProperty.staticvar);
     9     }
    10     privateProperty.staticmethod();
    11     return privateProperty
    12 })();
     
     
     1 //静态类
     2 var funcount = 0;
     3 var myfun4 = new function(){
     4     funcount++;
     5     this.printCount = function(){
     6         alert(funcount);
     7     }
     8 }
     9 myfun4.printCount(); //输出1;
    10 myfun4.printCount(); //输出1;
    11 myfun4.prototype.amethod = function(){
    12     alert("原型对象");
    13 }//运行错误
    14 var newfun4 = new myfun4();
    15 newfun4.amethod();
     
     
     1 //运行错误,说明myfun3创建并实例化之后就不能再为它添加方法,属性
     2 new myfun3.constructor().printCount();//如果你确实想实例化,这样也可以.
     3 //原型继承
     4 var myfun5 = function(){
     5 
     6 }
     7 myfun5.prototype.myfun5_extend = function(){
     8     alert("这是原型继承的");
     9 }
    10 var myfun5_sub = function(){
    11 
    12 }
    13 myfun5_sub.prototype = new myfun5();
    14 var newfun5 = new myfun5_sub();
    15 newfun5.myfun5_extend(); //这是原型继承的
    16 //调用继承
    17 var myfun6 = function(){
    18     this.method_p = function(){
    19         alert("这是调用继承的");
    20     }
    21 }
    22 var myfun6_sub = function(){
    23     myfun6.call(this);
    24 }
    25 
    26 var newfun6 = new myfun6_sub();
    27 newfun6.method_p();//这是调用继承的
    28 //覆盖
    29 var myfun7 = function(){
    30     this.method = function(){
    31         alert("这是父对象方法");
    32     }
    33 }
    34 var myfun7_sub = function(){
    35     this.method = function(){
    36         alert("这是子对象方法");
    37     }
    38 }
    39 myfun7_sub.prototype = new myfun7();
    40 var newfun7 = new myfun7_sub();
    41 newfun7.method(); //这是子对象方法,父对象方法被覆盖了.
    42 //多态
    43 function myfun8(a, b){
    44     var a = a;
    45     var b = b;
    46     if (typeof a == "number" && typeof b == "number") {
    47         alert(a * b);
    48     } else if (typeof a == "string" && typeof b == "string") {
    49         alert(a + b);
    50     } else {
    51         alert("输入错啦");
    52     }
    53 }
    54 
    55 myfun8(3, 4); // 输出12;
    56 myfun8("hi,", "你好");//输出hi,你好;
    57 myfun8("hi", 5);//输入错啦.
    58 
     
     

    这里讲了一个最最最简单的JS中基于原型链的继承和多态。

    先看一下以下这段代码的实现(A是“父类”,B是“子类”):

    var A = function(){
      this.value = 'a';
      this.showValue = function(){
        console.log(this.value);
      }
    }
    
    var a = new A();
    a.showValue();
    
    var B = function(){
      this.value = 'b';
    };
    
    B.prototype = new A();
    
    var b = new B();
    b.showValue();

    输出结果为:

    "a"
    "b"

    结果看来实现了一个函数,不同对象的执行,出现不同的结果。

    B.prototype = new A(); 这句将A“类”的构造方法,赋值给了B的构造原型,使B能够继承于A。

    b.showValue()过程中,先在b中寻找showValue,无果。在b的原型:B,中寻找showValue,而B的prototype已经被A的构造方法赋值,因此再向上一层,在A中找到showValue。因此执行。

    摘自:https://www.cnblogs.com/silence516/articles/1509456.html
  • 相关阅读:
    数据分析优化之惩罚性线性回归算法
    数据分析之贝叶斯算法案例
    SSM-CRUD练习
    使用 Code First 迁移以设定数据库种子
    .Net Web Api相关学习内容
    ASP.NET MVC5的学习知识点
    Entity Framework的学习(ASP.NET MVC5的学习中的一部分)
    EFCore框架的学习
    jsp中的<%%>用法
    nginx出现404和403错误
  • 原文地址:https://www.cnblogs.com/sweeeper/p/9778008.html
Copyright © 2020-2023  润新知