javascript原型
今天看了javascript 高级程序设计第二版,其中本书作者对prototype做了详细的介绍,也解决了自己一直对此的困惑,所以做下笔记记录下。
先是一个原型方式简单示例
function Person() { } Person.prototype.name = "Nicholas"; Person.prototype.age = 29; Person.prototype.job = "Software Engineer"; Person.prototype.sayName = function () { alert(this.name) };
当你创建function(比如new的时候)时,它的prototype属性也根据一系列规则创建,默认情况下,prototype都有一个constructor属性指向你创建的类型,比如,在上面例子中Person.prototype.constructor指向Person,然后根据constructor,其他的方法和属性会增添到prototype。
当constructor被访问创建一个实例时,这个被创建的实例内部有个指针指向prototype,通常被叫做_proto__。
如图:
下面看看它是怎么工作的。当访问对象的属性时(Person1和Person2),先在实体对象中寻找(Person1和Person2),如果找不到,在去—proto—所引用的Prototype中寻找。
function Person(){ } Person.prototype.name = “Nicholas”; Person.prototype.age = 29; Person.prototype.job = “Software Engineer”; Person.prototype.sayName = function(){ alert(this.name); }; var person1 = new Person(); var person2 = new Person(); person1.name = “Greg”; alert(person1.name); //”Greg” - from instance alert(person2.name); //”Nicholas” - from prototype
附注:
(初学者的理解,先放着,以后再核对)
每次创建对象时(比如new),prototype就会被创建,当同一类型被实例多次时,后面的prototype就会覆盖前面创建的,例子如下。
(1)
function test() { test.prototype.color=["red","yellow"]; } function test() { var q1=new test(); q1.color.push("green"); alert(q1.color); //red ,yellow,green var q2=new test(); alert(q2.color);//red,yellow alert(q1.color);//red,yellow
可以看出当 var q2=new test()时,此时创建的prototype已经覆盖了var q1=new test()时创建的。可以再看看下面的例子
(2)
function qwe() { qwe.prototype.color=["red","yellow"]; } function test() { var q1=new qwe(); var q2=new qwe(); q1.color.push("green"); alert(q1.color); //red ,yellow,green alert(q2.color);//red,yellow,green
这次的话,prototype在push("green")就已经确定,所以q1.color和q2.color显示的同一个东西。
从上也可以更好的理解为什么原型链继承不能用,例子如下
function superType() { this.Colors=["asd","red"]; } function subType() { } subType.prototype=new superType(); function test(){ var mySubType1=new subType(); mySubType1.Colors.push("green"); alert(mySubType1.Colors); //asd,red,green var mySubType2=new subType(); alert(mySubType2.Colors); //asd,red,green }