javascript那些事(1)

    最近看到winter(寒冬)老师的一篇博文，说的是js这类基于原型的继承与普通的基于类继承方式的差异。文章最后抛出几个有意思的小练习尝试的解决了下。

一般来说，创建一个对象有如下三个步骤：

    1. 构建一个新对象

    2. 把新对象的__proto__指向函数对象的共有对象属性:prototype

    3. 以新对象为this执行构造函数

Function.prototype.prop=1;
alert(Object.prop)
alert(Function.prop)

输出：1, 1

怎么理解呢？

首先应该知道，所有的constructor(构造器)的原型链模型：selfFunction.__proto__ ==> Function.prototype.__proto__==> Object.prototype

那么：

Object.prop ==> Object.__proto__.prop === Function.prototype.prop === 1

Function.prop ==> Function.__proto__.prop === Function.prototype.prop === 1

Object.prototype.prop=1;
alert(Object.prop)
alert(Function.prop)

同理：

Object.prop ==> Object.prototype.prop === 1

Function.prop ==> Function.__proto__.prop === Function.prototype.prop ==>Function.prototype.__proto__.prop === Object.prototype.prop === 1

Function.__proto__.prop=1;
alert(Object.prop)
alert(Function.prop)

推导：

Object.prop ==> Object.__proto__.prop === Function.prototype.prop === Function.__proto__.prop === 1

Function.prop == >Function.__proto__.prop === 1

Object和Function一样都是constructor所以他们的__proto__属性都指向Function.prototype。

function Class(){
}
Class.prototype=Class;
Class.__proto__.prop=1
alert((new Class).prop);

    这里new了一个对象然后访问其prop属性，根据之前说的构造对象的三个步骤，我们可以知道新对象的__proto__属性指向Class这个constructor的prototype，所以有：

var client = new Class;

client.prop ==>client.__proto__.prop === Class.prototype.prop ==> Class.prototype.__proto__.prop;

又因为Class.__proto__.prop = 1. 且，Class.prototype=== Class，==>Class.prototype.__proto__.prop === 1.

function Class(){}
Class.prototype=Class.__proto__;
Function.prototype.prop=1;
alert((new Class()).prop)

基于上面几个推导过程，可以很快的得出结果：

(new Class()).prop ==> (new Class()).__proto__.prop === Class.prototype.prop === Class.__proto__.prop ==>

Function.proptype.prop === 1

function Class(){
}
Class.prototype.__proto__.prop=1;
Class.prototype=new Class;
alert((new Class).prop);

这个例子有点不好解释, 首先看看Class.prototype.__proto__.prop=1;这句做了什么，

 一个函数在声明之后，默认会得到自己的一个prototype属性，指向一个全新创建的Object，就跟{}一样。所以：

Class.prototype.__proto__ === Object.prototype //true，所以这一句实际上是对Object.prototype新增一个prop属性。

Class.prototype.__proto__.prop = 1;

var classProto = Class.prototype;

var classNewProto = Object.create(classProto, {});

classNewProto.__proto__ === classProto //true

Class.prototype = classNewProto;

var inst = Object.create(classProto, {});

so:

inst.__proto__ === classNewProto//true

inst.__proto__.__proto__ === classProto //true

inst.__proto.__proto__.__proto__ === Object.prototype//true

最后通过原型链在Object.prototype上找到了prop属性。