__proto__属性是什么

__proto__属性_proto_是prototye的容器。
在官方的es5中,定义了一个名叫[[prototype]]的属性,每个对象都拥有这样一个属性,这个属性是一个指针,它指向一个名叫原型对象的内存堆。而原型对象也是对象,因此又含有自己的[[prototype]]的属性,又指向下一个原型对象。 那么终点是哪? 当然是我们的Object.prototype对象。
也就是说,js中的对象模型大概是这个样子:
在这里插入图片描述

使用字面量定义一个对象时: var foo={};
创建一个函数对象时:function Foo();
使用构造函数定义一个对象时: var foo=new Foo();
以上是最基本的三个状态,其他的状态都是由这三个状态变化而成的。
1 先来看第一个情况: var foo={};
此时会生成一个新的对象,而由于没有对他的[[prototype]]进行任何的操作,所以默认情况下所指向的是Object.prototype对象:
var foo={};
foo.proto===Object.prototype;//true
Object.prototype.toString.call(foo.proto);//该方法返回对象类型的字符串:object Object
foo.hasOwnProperty(‘proto’);//false
在这里插入图片描述

   但是,让我们来看下代码的最后一行,执行的结果却是false。 也就是__proto__并非在普通对象的内部,它其实是在Object.prototype上。而 foo.__proto__可以正常运行,是因为引擎调用了getter函数,大家可以试下执行:alert(foo.__proto__),你会看到输出结果为:function(){} ,意思为这个指针所访问的内容是个空函数。这个里面比较复杂,有兴趣的可以去看看:深入js这本书。但是一般情况下,我们可以简单的理解为访问__proto__时,就是在访问Object.prototype,如果你没把__proto__指向其他对象的话。 
   2 接下来看看比较复杂的第二张情况:function Foo();
   我们知道,Foo函数也是一个对象,当然他也可以访问__proto__内部属性。但是他的__proto__的内部属性并非跟普通对象一样指向Object.prototype对象,相反他指向Function.prototype对象,而Function.prototyp对象的__proto__再指向Object.prototype。 
 
function foo(){};
Object.prototype.toString.call(foo.__proto__);//object  Function
foo.__proto__===Function.prototype;//ture

Object.prototype.toString.call(foo.proto.proto);//object Object
foo.proto.proto.===Object.prototype;//ture
在这里插入图片描述

 我们知道,每个Js函数对象,都拥有一个原型对象,这个原型对象是函数自己的属性,并且这个原型对象跟普通对象没有区别,因此它也可以访问__proto__,自然它的__proto__指向的是Object.prototype了。 
function foo(){};
alert(foo.hasOwnProperty('prototype'));//ture  prototype为foo的自身属性
alert(foo.propertyIsEnumerable('prototype'));//false  prototype不可枚举
foo.prototype.__proto__===Object.prototype;// 原型对象访问__proto__属性,指向Object.prototype
 也就是说。原型对象是在函数对象下的一个属性,而普通对象是没有原型对象。这就为接下来的用new 调用函数进行面向对象编程打下了基础。 
 结合起来,当我们定义一个函数时, 内部同时产生了 __proto__和prototype属性 
  
  3 最后来看看最复杂的: var foo=new Foo{};
   对于new操作,一般来讲是四步操作:1 生成一个新对象  2 将新对象执行原型链接到函数的prototype对象上,3 把新对象绑定到this上, 4 如果没有return,返回函数执行结果的新对象。 
  这里的关键点在于第二步操作。很多人将其解释为,new的新对象是函数自身的prototype对象,其实根本不是如此。通过上面的第二点的代码,我们就已经知道了函数原型对象一开始就便存在,只是它是不可枚举的空对象而已。 而且,有个重点:函数原型对象没有在原型链中!也就是说引擎进行右值查询时,根本不会理会函数原型对象!

function foo(){};
foo.prototype.y=10;
alert(foo.y);// undefined
foo.proto.x=10;
alert(foo.x);// 10
从上面的我们就可以看出, 对函数对象进行原型链查询,是不会检索函数原型对象的。
那么new所创建的是个什么对象呢? 我们知道在函数作用域里所定义的变脸,外部环境是访问不到的。这样的话,如何把内部所生成好的变量传递给外部变量呢?最主要的方式是使用return .而另一个情况:在c++这些语言中,则是创建一个匿名对象,由匿名对象保存函数所生成的数据,然后当它把数据传递给外表环境时,自身就会释放内存消失掉。
js中正是使用的后一个方法:它创建一个匿名的对象,负责保存所有的数据,同时在没有return情况下,当对象把数据传递给外表环境后就释放内存:

function Foo(){this.a=a;};
var test=new Foo(10);

上面代码的内部情况为:
在这里插入图片描述

当Foo函数执行完成后,匿名对象消失,所有的数据都被保存到了test上。此时,test的__proto__就指向了之前的函数原型对象了,而不再是Object.prototype. 
  • 8
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值