Javascript讲解系列之一 Prototype原型链详解

   以前没有写博客的习惯，许多的技术积累顶多都是自己稍微总结一下，很少共享，不是自私，而是工作比较忙，老板们只喜欢你老老实实地干活，可是如果只干活不注重积累很容易成为公司工作的奴隶，学不到新东西，实力也难以提高；前几天接到一个电话面试被鄙视，才发现公司所用的DOJO并不被外面广泛接受，所学仅为九牛一毛，故而决定把自己所学分享出来，为夯实基础，也为多多与外界交流，形成一种渠道。如需联系，请发送至邮箱：[email protected]

   今天写Javascript系列之第一篇：Prototype原型链。在中关村软件园里随便拉一个码农估计都会写JS，大部分也都会知道JS是基于原型链的设计，但是如果问题JS原生对象（Object,Function,Array,Date等）的这个链到底长什么样子？估计能回答出来的人就少了，我开始也非常糊涂，后来决心一定要好好搞一下，花了2天功夫基本算是明白了，分享如下：

   准备环境：Firefox、Firebug；

   为了做好铺垫，先解释清楚一下的概念：

   1）类型、原生类型、对象类型（types、primitive types、object types）

   不像我们在学习JAVA时，被告知JAVA是完全OOP的语言，class是一类具有共同特点的抽象，object是某个class下具体的一个实现，Object类是所有类的顶层父类，对Java的学习是从类与对象开始的；Javascript则不然，它是从类型（type）开始入门，你在各类语言中遇到的number，string, boolean, object, function都属于类型。

   这些类型在JS中分为两大类：原生类型与对象类型，原生类型包括：number，string, bool, null, undefined；剩下的非原生类型对象都属于对象类型，包括：object, array, function等，那这里的object专指具有属性（attribute）的对象，下面以代码在Firebug中的输出示例。一般判断某个赋值是什么大的类型没有意义，往往是判断它是什么原生类型或者对象类型。

function log(arg){  console.log(arg);   }
var opts = Object.prototype.toString;
// 1) primitive types
log(typeof 1);                          // number
log(typeof "");                         // string
log(typeof false);                      // boolean
log(typeof undefined);                  // undefined
log(typeof null);                       // object       null是个特列，属于原生类型；
log(null instanceof Object);            // false
// 2) object types.
log(typeof new Object);                 // object
log(typeof new Function);               // function
log(typeof new Array);                  // object
                                                                                                                                                                                                 
log(opts.call(new Object));             // [object Object]
log(opts.call(new Function));           // [object Function]
log(opts.call(new Array));              // [object Function]

   如上面的代码所示，判断原生类型，使用typeof关键字就可以；判断对象类型呢，我们可以使用toString()方法来达到目的；

   2）prototype与__proto__的区别

   两者都是对象类型的两个属性，并非所有的对象类型都有prototype属性，一般只有function对象才有prototype属性(除非主动赋值)，它指向的是一个对象，将来会被多个实例所继承（或者说该对象处于多个实例的原型链上）；__proto__才是真正的原型链的实际指针，然而许多浏览器并不支持这个属性对外公开使用，Firefox却暴露出这一属性，以供方便了解。下面我们用一段代码来做验证：

// 1) prototype属性：一般只有function对象拥有
log((new Object).prototype);                    // undefined
log([].prototype);                              // undefined
log((new Function).prototype);                  // anonymous {}
                                                // Function, Object, Array是function对象
log(Function.prototype);                        // function()
log(Object.prototype);                          // Object {}
log(Array.prototype);                           // []
// 2) __proto__属性：指向该对象原型链的上一端
log((Object.prototype).__proto__);              // null
log((Function.prototype).__proto__);            // Object {}
log(Object.__proto__);                          // function()
log(Function.__proto__);                        // function()