JavaScript创建对象：深入理解编程原理

在学习JavaScript的过程中，经常被它的对象系统(Object，Function，Prototype)搞的云里雾里的，感觉这些东西如果不搞清楚，后续的JavaScript学习也会不扎实，所以，下决心把它搞清楚，让我们开始吧!

　　这个学习过程中，主要的参考书目是《JavaScript: The Good Parts》、《JavaScript: The Definitive Guide》和《Object-Oriented JavaScript: Create scalable, reusable high-quality JavaScript applications, and libraries》;主要的分析工具是IE和IE开发者工具。

　　1. 对象

　　JavaScript语言没有类的概念，除了基本类型(Number、String、booleans、null和undefined)之外，一切都是对象。对象的定义如下，用英文比较准确：

　　Objects are mutable keyed collections.
　　An object is a container of properties, where a property has a name and a value.
　　A property name can be any string, including the empty string.
　　A property value can be any JavaScript value except for undefined.
　　这些都不难理解，关键是这个：

　　Object includes a prototype linkage feature that allows one object to inherit the properties of another.

　　这里，这个原型链接(a prototype linkage)是隐藏的(在Debugger里面看不见的)，在某些实现中，它的属性名是__proto__

　　补充一下，任何一个对象的__proto__链接都是不为空的，对于一个从Object Literal中创建的对象，其__proto__指向Object.prototype。

　　有了__proto__链接之后，就可以发挥一些面向对象的威力了，头一个就是Delegation。Delegation是指当从一个对象中获取一个属性失败时，JS会自动再尝试去其__proto__链接指向的对象中去查找，如果还找不到，就沿着__proto__一路找上去，指导找到Object.prototype为止。根据上述Delegation算法的描述，你可以很容易理解Delegation过程是动态的，这次可以从祖先中找到A属性，不代表下次一定能找到。

　　这里需要注意的是，__proto__链接只对查询有效，而对Update无效，也就是说，如果你给一个属性赋值的话，而这个属性在该对象中还不存在，而在__proto__祖先中已有同名属性，但这是JS会在该对象中再新建一个属性，而不是修改祖先的属性值。

　　函数对象首先是一个对象，所以，它也有__proto__链接，也有Delegation。函数对象还有一个特殊之处就是它会有一个叫做prototype的属性(又是prototype?, 对，这就是我一直用__proto__链接来代表上文提到的prototype linkage，这样可以避免混淆)。

　　当用var Class = function(){}定义一个函数时，JS会生成一个函数对象F，函数对象F的__proto__指针指向Function.prototype, 同时F还会有一个property属性，property属性的引用一个新创建的对象p，这个对象p只有一个属性是构造函数constructor()，构造函数constructor()的值就是函数对象F，而对象p的__proto__指针则指向Object.Prototype，如下图：

 

　　了解了函数对象，再看看它如何发挥作用：当用new激活一个函数时，一个新对象会被创建出来，其内容是执行函数的返回结果，而这个对象的__proto__链接指向函数的prototype属性所引用的对象

　　，如下面的例子所示：

 

　　抽象一下，就是这样：

 

　　另外，如果你只是简单写写网页，的确可能不需要把JS搞懂这么清楚，但是如果你真正重视JS，打算应用例如node.js，backbone.js这样的JS框架的话，那么，我认为还是需要真正把JS搞明白的。

　　好，切入正题吧，在JavaScript: The Good Parts当中，给出了一个创建对象的常用方式：

Object.create = function (o) {

　　var F = function () {};

　　F.prototype = o;

　　return new F();

　　};

　　var b=Object.create(a);

　

 

　结合1,2节的内容，我们来理解一下上述这段代码：

　　首先，在执行var b=Object.create(a);之前，已经有了a对象，如下图：

　　

　　在执行了var F = function () {};之后，F函数对象被创建出来，他的property属性也被赋值指向一个新创建出来的对象，详细规则在第二节描述过:

　　当用var ff = function(){}定义一个函数时，JS会生成一个函数对象F，函数对象F的__proto__指针指向Function.prototype(在下图中省略了), 同时F还会有一个property属性，property属性的值指向一个新创建的对象P，这个对象P只有一个属性是构造函数constructor()，构造函数constructor()的值就是函数对象F，而对象P的__proto__指针则指向Object.Prototype。

　　

　　执行了F.prototype = o; 之后, F的prototype属性指向了对象A.　　

　　执行new F();之后，根据第2节中描述的规则，执行之后的对象关系如下：

　　当用new激活一个函数时，一个新对象会被创建出来，其内容是执行函数的返回结果，而这个对象的__proto__链接指向函数的prototype属性所引用的对象

　　函数Object.create返回之后，F和p都不存在了，因此，最后的对象关系.　　

　　总结一下，我们可以看到，对象的__proto__链接是不能直接修改的，而函数对象的prototype属性是可以修改的，因此，Object.create实际上是利用了这个特点，结合new来完成了一个拷贝创建的过程，希望这个例子能够帮助大家更好地理解!!