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属性。
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。