Javascript原型学习笔记

三个基本概念：构造函数、原型、实例  

每个构造函数都有一个原型对象（prototype），原型对象都包含一个指向构造函数的指针（constructor），而实例都包含一个指向原型的内部指针（__proto__）。

emp1：

function Foo(y){ 
this.y = y ; 
}
Foo.prototype.x = 10;
Foo.prototype.calculate = function(z){ 
return this.x+this.y+z; 
};
var b = new Foo(20);
alert(b.calculate(30))；

 全部函数的默认原型都是Object的实例，所以默认原型内部都有一个指针，指向Object.prototype，这也正是全部自定义对象都会继承toString()、valueOf()等方法的根本缘由。

Foo的构造函数时Function   任何一个对象的__proto__都有值，由于每个对象都有构造函数。

如图：

 

函数与对象

函数是对象，对象又都是经过函数建立的。任何一个函数内都有prototype属性。

在javascript中，一个对象就是任何无序键值对的集合,若是它不是一个主数据类型(undefined，null，boolean，number，or string)，那它就是一个对象。

false明明是一个主数据类型，false.__proto__也会返回一个值 。由于在代码执行它会被强制转化成一个对象（Boolean 基本包装类型）。

原型写法

分步写法：（具备实时性）

function a (){
    this.age = 1;
}   
a.prototype.str = 'ss';
var b = new a();
a.prototype.name='tom';
console.log(b.str);//ss
console.log(b.name); //tom 

 

字面量写法：（会致使原型重写）    

        function a(){
            this.name = 'w';
        }
        a.prototype.str = 's';
        var b = new a();
        console.log(b.str); //s
       //字面量写法
        a.prototype = {
            x:1
        };
        //a原型重写并无反映到a以前建立 的实例中
        console.log(b.str); //s
        console.log(b.x);//undefined
        //a的原型反映到重写后建立的实例中
        var c = new a();
        a.prototype.q = 3;
        console.log(c.x); //1
        console.log(c.q); //3
        console.log(c.str); //undefined

 

 

原型链 继承

函数a的原型为函数b的实例，函数a的实例就会继承a和b的原型的全部方法和属性。  见图《JavaScript高级程序设计》p163

 

new

__proto__本质上实际上是标准里规定的[[prototype]]属性，本来是不可用 js 访问的，后来（听说标准里又规定能够）firefox 和 chrome 中把这个属性命名为__proto__。后来ES又添加了函数getPrototypeof，这样就能够经过这个函数来访问这个属性，因此这个__proto__如今不是标准的一部分。

而后，再说new的建立过程，当执行new func()的时候，执行过程以下：
一、首先建立一个新的对象，好比叫 obj；
二、obj.[[prototype]] = func.prototype;
三、令this=obj,执行函数 func;
四、若是 func 的返回值是一个对象，则 new 的返回值就是这个对象，不然返回值是 obj

<script type="text/javascript">

var animal = function(){};
var dog = function(){};

animal.price = 2000;
dog.__proto__ = animal;
var tidy = new dog();

console.log(dog.price) //2000
console.log(tidy.price) // undefined

</script>

 

constructor

constructor指的就是对象的构造函数   对象是由函数构造的

function Foo(){}; 
var foo = new Foo(); 
alert(foo.constructor);//Foo 
alert(Foo.constructor);//Function 
alert(Object.constructor);//Function 
alert(Function.constructor);//Function 

由于Foo,Object,Function都是函数对象，又由于全部的函数对象都是Function这个函数对象构造出来,因此它们的constructor为Function

 

prototype与constructor的关系 

function Dog(){}

(Dog === Dog.prototype.constructor);//true 
console.log(Dog.prototype.hasOwnProperty('constructor'));//true 

function Animal(){} 
function Person(){} 
var person = new Person(); 
console.log(person.constructor); //Person 

 

 任何一个函数的原型都有constructor属性    

person是Person的实例，因此person继承Person原型上的全部属性和方法，Preson原型有constructor属性并指向Preson，因此person有constructor属性并指向Preson

深刻一点

function Animal(){} 
function Person(){} 
Person.prototype = new Animal(); 
var person = new Person(); 
alert(person.constructor); //Animal 

 

如图

图中的虚线表示Person默认的prototype指向(只做参考的做用)。可是咱们将Person.prototype指向了new Animal。

 

还有

hasOwnProperty instanceof isPrototypeOf函数 原型属性值包含应用类型值等问题