zoukankan      html  css  js  c++  java
  • js中的prototype属性

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

    这个属性非常有用:为一个特定类声明通用的变量或者函数。

    你不需要显式地声明一个prototype属性,因为在每一个构造函数中都有它的存在。

    例如:

    function cat()

    {

    }

    alert(cat.prototype); //输出的是"Object"

    由此可以看出,prototype是一个对象,那么这个对象有什么用呢

    例如有一个People类:

    function People(id,name)

    {

    this.id = id;

    this.name = name;

    }

    People.prototype.address = "earth";

    我们创建两个People对象

    var people1 = new People(1,"小三");

    var people2 = new People(2,"小四");

    那么people1和people2的属性则为

    people1:
    People {id: 1, name: "小三", address: "earth"}
    people2:
    People {id: 2, name: "小四", address: "earth"}
     
    你看到所有的People 除了自己的独有属性id和name外,还都有一个共同的属性address,我们甚至都没有为每一个people特别声明这些属性。这是因为当一个对象被创建时,
    这个构造函数 将会把它的属性prototype赋给新对象的内部属性__proto__。这个__proto__被这个对象用来查找它的属性。

    你也可以通过prototype来给所有对象添加共用的函数。这有一个好处:你不需要每次在构造一个对象的时候创建并初始化这个函数。

    例如:

    function People(id, name,sex)
    {
    this.id=id;               
    this.name=name; 

    this.sex = sex;

    }
    People.prototype.getSex=function getSexFunction()
    {
    return this.sex;
    }

    People.prototype.setSex=function setSexFunction(sexValue)
    {
    this.sex = sexValue;
    }

    我们可以象通常那样创建对象:

    var people1=new People(1,"Joan", "男");
    var people2=new People(2,"Kim", "女");
    var people3=new People(3,"Sam", "人妖");

    并验证它:

    alert(people1.getSex());   // 输出 "男"
    alert(people2.getSex());   // 输出 "女"
    alert(people3.getSex());   // 输出 "人妖"

    我们也可以这样来使用prototype:

    A.prototype = new B();

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

    先看一个实验的例子

    function A()
    {
         this.show= function()
        {
         alert("A::show");
        }
    }

    function B()
    {
    }

    B.prototype = new A();
    var B1 = new B();
    B1 .show(); // 显示A::show

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

    例子:

    function A()
    {
         this.show= function()
        {
         alert("A::show"); 
        }
    }

    function B()
    {

     this.show= function()
        {
         alert("B::show"); 
        }
    }

    B.prototype = new A();
    var B1  = new B();
    B1 .show(); // 显示B::show

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

    参考文章:

    http://blog.csdn.net/tianyitianyi1/article/details/6929916

    http://blog.sina.com.cn/s/blog_7045cb9e0100rtoh.html

    http://www.cnblogs.com/yjf512/archive/2011/06/03/2071914.html

  • 相关阅读:
    vue中的 computed 和 watch 的区别
    mysql8.0 初始化数据库及表名大小写问题
    sql server alwayson 调整数据文件路径
    zabbix 自定义监控 SQL Server
    mysql 创建用户及授权
    mysql 设置从库只读模式
    mysql8.0 主从复制安装及配置
    centos8.0安装mysql8.0
    centos8替换阿里数据源
    npm publish 报错 【you or one of your dependencies are requesting a package version that is forbidden by your security policy】
  • 原文地址:https://www.cnblogs.com/liujidong/p/3947087.html
Copyright © 2011-2022 走看看