JS 中讨厌的 prototype constructor _pro_ 理解

浏览数：59 / 时间：2015年06月09日

这几天一直在看着块，哎，看的人头都大了，差不多明白了，总结一下。

prototype:创建的每一个函数都有一个prototype属性，这个属性指向一个prototype对象。即他是通过构造函数而创建的实例对象的原型对象（属性存在于构造函数中）。

constructor:这个属性在原型对象中，指向函数中的prototype属性。（存在于原型对象中，原型对象===原型）

_proto_:这个属相存在于实例中，指向原型。

举个栗子：

function ljd(){
this.name="ljd";
}

ljd.prototype.age=20;
a=new ljd();

a.age;
ljd.prototype.constructor;

这段简单的代码会打印出什么呢》、？？

大家思考明白这个问题应该就会理解这里面恩怨纠葛了。

然后还有一个注意点：

这样重新定义原型，他的constructor属性会指向Obcject;

function ljd() {
  this.name = ‘ljd‘;
}
ljd.prototype.age = 20;
ljd.prototype = {
  sex:
  ‘male‘,
  job: ‘student‘
};

ljd.prototype.constructor;

这个呢是输出Object（）的。

还有这样写原型中就木有age属性了，完全重构。

其实也好理解，这个语法 x={} 相当于创建了个obcjec实例啦~~。

原型对象存在的问题：

举个栗子：原型对象中有一个数组，第一个实例push 进一个元素后，第二个实例的数组中也会有该元素。

再来谈谈JS中的继承问题：

先说说 new 创建一个实例有以下三个步骤 a1=new A;

1、新建一个对象并赋值给变量a1：var a1 = {};

2、把这个对象的[[Prototype]]属性指向函数A的原型对象：a1.[[Prototype]] = A.prototype

3、调用函数A，同时把this指向1中创建的对象a1，对对象进行初始化：A.apply(a1,arguments)

 function SuperType() {
        this.property = true;
    }

    SuperType.prototype.getSuperValue = function() {
      return this.property;
    };

    function SubType() {
        this.subproperty = false;
    }

    //继承了SuperType
    SubType.prototype = new SuperType();
    SubType.prototype.getSubValue = function() {
        return this.subproperty;
    };

    var instance = new SubType();

注意这句

SubType.prototype = new SuperType(); //相当于重写了SubType.prototype,所以就像上面提到的constructor属性改变

SubType.prototype.constructor ==Super.

好了太晚了今天就先到这。。。晚安

突然忘了，还有这段代码，大家看下学下JS中的组合继承。

<script>
    function Par(name,value){
        if(!arguments.length) return;
        this.name = name;
        this.value = value;
    }
    function Job(name,value,job){
        if(!arguments.length) return;
        Par.apply(this,arguments);
        this.job = job;
    }
    function Age(name,value,job,age){
        if(!arguments.length) return;
        Job.apply(this,arguments);
        this.age = age;
    }
    Par.prototype.showName = function(){
        alert(this.name);
    };
    Job.prototype = new Par();
    Job.prototype.showJob = function(){
        alert(this.job);
    };
    Age.prototype = new Job();
    Age.prototype.showAge= function(){
        alert(this.age)    
    };
    
    var a = new Age(‘123‘,‘dw2‘,‘sad‘,21);
    
    a.showName()
    //alert(a.constructor)
</script>