• JavaScript中的 prototype 和 constructor


      prototype属性

        任何js函数都可以用作构造函数, 而构造函数需要用到prototype属性, 因此, 每个js函数F(除了ES5的Function.bind()方法返回的函数外) 都自动拥有一个prototype属性. 

      F.prototype的值是一个对象 o , o 默认包含唯一一个不可枚举的属性: constructor , 值默认指回 F,可以修改.

      调用 F 构造的对象继承 F.prototype 对象.

      F.prototype 是类的唯一标识.  当且仅当两个对象继承自同一个原型对象时, 它们才属于同一个类的实例. 而构造函数只是对象创建好之后, 当成是该对象的方法立即调用一次.不能作为类的标识. 如果两个构造函数的prototype属性指向同一个原型对象, 则它们创建的实例属于同一个类.

    function C1(){
        this.y = 1;
    }
    function C2(){
        this.y = 2;
    }
    var p = {x:10};
    C1.prototype = p;
    C2.prototype = p;
    var c1 = new C1();
    var c2 = new C2();
    console.log(c1 instanceof C2); //"true"
    console.log(c2 instanceof C1); //"true"
    

        

      instanceof 运算符检测对象是否属于某个类(名字和构造函数 F 同名)时, 实际上是检查是否继承自 F.prototype.  c1 instanceof C1; // 如果 c1 继承自 C1.prototype, 则返回true, 而不是检查c1是否由C1()初始化而来. 而instanceof运算符则强化了构造函数是类的公有标识的概念. 

      js基于原型的继承机制是动态的,创建对象后, 原型的属性发生改变, 也会影响到继承这个原型的所有实例对象.而且也可以修改内置类的原型对象.

      constructor属性

      F.prototype.constructor 的值为一个函数对象, 默认指向 F 本身.

      构造函数 F 是类的 "公共标识",  constructor属性被对象继承下去了, 所以  var obj = new F() 后  obj.constructor 就能找到其构造函数, 也可以说找到了类. 但是修改了  F.prototype  之后, constructor属性也可能改变了, 可以手动修改回来.

      

      二者的关系

    var F = function(){};
    var p = F.prototype;
    var c = p.constructor;
    console.log(c === F); // "true"
    
    var F = function(){
    };
    var G = function(){
        console.log("I am G");
    };
    F.prototype.constructor = G;
    var o = new F();
    console.log(o.constructor === G); //constructor 属性说明是G, 返回: true
    console.log(o.constructor === F); // constructor 属性说明类的构造函数, 现在已经变为G了. 所以: false
    console.log(o instanceof F); // o 继承自 F.prototype, 所以是: true
    console.log(o instanceof G); // o 不是继承自 G.prototype, 所以是 false
    

      参考: <<JavaScript权威指南: 第6版>>

  • 相关阅读:
    Mac下tomcat的安装与配置
    jquery中的属性和css
    jquery中的选择器
    数组对象元素的添加,String对象,BOM对象以及文档对象的获取
    js中的函数,Date对象,Math对象和数组对象
    js中的循环语句
    js中的运算符和条件语句
    js中的数据类型及其转换
    js的意义,引用方法及变量
    移动端网页项目总结
  • 原文地址:https://www.cnblogs.com/roger9567/p/5059368.html
Copyright © 2020-2023  润新知