• JS中的prototype


    prototype 属性使您有能力向对象添加属性和方法。

    prototype 属性使您有能力向对象添加属性和方法。

    语法

    object.prototype.name=value

    实例

    在本例中,我们将展示如何使用 prototype 属性来向对象添加属性:

    <script type="text/javascript">
    
    function employee(name,job,born)
    {
    this.name=name;
    this.job=job;
    this.born=born;
    }
    
    var bill=new employee("Bill Gates","Engineer",1985);
    
    employee.prototype.salary=null;
    bill.salary=20000;
    
    document.write(bill.salary);
    
    </script>
    

    输出:

    20000

    1 原型法设计模式

    在.Net中可以使用clone()来实现原型法

    原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展。我们称B的原型为A。

    2 javascript的方法可以分为三类:

    a 类方法

    b 对象方法

    c 原型方法

    function People(name)
    {
      this.name=name;
      //对象方法
      this.Introduce=function(){
        alert("My name is "+this.name);
      }
    }
    //类方法
    People.Run=function(){
      alert("I can run");
    }
    //原型方法
    People.prototype.IntroduceChinese=function(){
      alert("我的名字是"+this.name);
    }

    //测试

    var p1=new People("Windking");

    p1.Introduce();

    People.Run();

    p1.IntroduceChinese();

    3 obj1.func.call(obj)方法

    意思是将obj看成obj1,调用func方法

    好了,下面一个一个问题解决:

    prototype是什么含义?

    javascript中的每个对象都有prototype属性,Javascript中对象的prototype属性的解释是:返回对象类型原型的引用。

    A.prototype = new B();

    理解prototype不应把它和继承混淆。A的prototype为B的一个实例,可以理解A将B中的方法和属性全部克隆了一遍。A能使用B的方法和属性。这里强调的是克隆而不是继承。可以出现这种情况:A的prototype是B的实例,同时B的prototype也是A的实例。

    先看一个实验的例子:

    function baseClass()
    {
      this.showMsg = function()
      {
         alert("baseClass::showMsg");  
      }
    }

    function extendClass()
    {
    }

    extendClass.prototype = new baseClass();
    var instance = new extendClass();
    instance.showMsg(); // 显示baseClass::showMsg

    我们首先定义了baseClass类,然后我们要定义extentClass,但是我们打算以baseClass的一个实例为原型,来克隆的extendClass也同时包含showMsg这个对象方法。

    extendClass.prototype = new baseClass()就可以阅读为:extendClass是以baseClass的一个实例为原型克隆创建的。

    那么就会有一个问题,如果extendClass中本身包含有一个与baseClass的方法同名的方法会怎么样?

    下面是扩展实验2:

    function baseClass()
    {
        this.showMsg = function()
        {
            alert("baseClass::showMsg");  
        }
    }

    function extendClass()
    {
        this.showMsg =function ()
        {
            alert("extendClass::showMsg");
        }
    }

    extendClass.prototype = new baseClass();
    var instance = new extendClass();

    instance.showMsg();//显示extendClass::showMsg

    实验证明:函数运行时会先去本体的函数中去找,如果找到则运行,找不到则去prototype中寻找函数。或者可以理解为prototype不会克隆同名函数。

  • 相关阅读:
    asp.net mvc 中直接访问静态页面
    (转)asp.net文本编辑器(FCKeditor)
    (转)后缀为 ashx 与 axd 的文件有什么区别
    最全的ASP.NET开源CMS汇总
    打造属于自己的设计模式
    分布式文件系统应用(上篇 理论)
    结合项目实例 回顾传统设计模式(一)策略模式
    动态方法与动态代理(上篇)
    分布式文件系统应用(下篇 实践)
    关于领域驱动设计与面向数据库设计
  • 原文地址:https://www.cnblogs.com/zhaoleigege/p/4794622.html
Copyright © 2020-2023  润新知