Javascript原型链（二）

上一篇文章粗略的理解了一下什么是原型和原型链概念。这篇文章记录一下自己对创建对象的过程的深入理解。

一、new创建对象的过程

首先我们都知道javascript创建一个对象的方式可以是使用构造函数方式。比如：

<script type="text/javascript">
    function Person(name,age){
        this.name=name;
        this.age=age;
        // return this;
    }
    var p1=new Person("xiaoming",18);
</script>

这是常见的使用构造函数创建一个对象。其中p1是通过传入参数的方式创建一个新的实例。那么它的背后的原理是通过new关键字进行创建的。我们从var p1=new Person("xiaoming",18); 这段代码开始。首先我们是定义一个变量p1保存属性值，当通过new这个关键字的时候，会回到Person()这个构造函数中，this代表的是创建空对象，当我传入的参数成功，那么默认会执行return this; 这个语句，其意思就是返回一个对象，返回之后再赋值给变量p1。
总的来说就是这样：

new Person() —– this变成空对象 —–return this返回结果 —-赋值p1

这就是构造函数创建实例的过程。

---

二、常见的构造函数的写法

var a={}      // 相当于var a = new Object()
var array=[]  // 相当于var array = new Array()
var function(){} //相当于var function = new Function(){}

所以function其实就是一个对象。如何判断某一个变量属于哪个构造函数，可使用 instanceof 关键字，代码如下：

<script type="text/javascript">
    var a={}
    var b={}
    function Func(){}
</script>

运行结果如下：

---

三、原型规则

所有引用类型（数组、对象、函数），都具有对象特性
所有引用类型（数组、对象、函数），都有一个__proto__指针，即隐式原型
所有的函数，都有一个prototype属性，属性值也是一个普通的对象，即显示原型
所有的引用类型（数组、对象、函数），__proto__指向它的构造函数的prototype属性值
当某一个对象没有其属性值时，会通过__proto__属性向上查找。

```
<script type="text/javascript">
    var a={}
    var b={}
    function Func(){}
</script>

从上述的代码可知，a instanceof Object等于true，说明Object是对象a的原型。那么Object也是一个构造函数，函数都有一个prototype属性，按照上述的原型规则。

a.__proto__ === Object.prototype //true

针对于第四个规则，贴上代码：

function Foo(name){
        this.name=name;
    }
    Foo.prototype.FooName=function(){
        console.log('I am Foo!! ');
    }
    var f = new Foo('zhangsan');
    f.HooName= function(){
        console.log('I am Hoo!!')
    }

当f这个对象找不到其方法时，会通过__proto__属性去向上查找（也就是根据原型构造函数的prototype属性去查找）。运行效果：

此时为了验证结果的正确性，也就是验证FooName并不是对象f的属性，我们可以使用hasOwnProperty这个方法，我们在后面添加一段代码。

var item;
    for (item in f){
        if(f.hasOwnProperty(item)){
            console.log(item);
        }
    }

运行结果如图：

这就是原型链，如果上面没有就继续往上找。