__proto__ VS. prototype in JavaScript

http://dmitrysoshnikov.com/ecmascript/javascript-the-core/#a-prototype-chain

// a constructor function
function Foo(y) {
// which may create objects
// by specified pattern: they have after
// creation own "y" property
this.y = y;
}

__proto__ is the actual object that is used in the lookup chain to resolve methods, etc. prototype is the object that is used to build __proto__ when you create an object with new:

( new Foo ).__proto__ === Foo.prototype;
( new Foo ).prototype === undefined;

How does __proto__ differ from constructor.prototype?

I've been trying to wrap my head around this recently and finally came up with this "map" that I think sheds full light over the matter

I know I'm not the first one making this up but it was more interesting figuring it out that finding it :-). Anyway, after that I found e.g. this another diagram that I think says basicly the same:

Javascript object layout

The most surprising thing for me was discovering that Object.__proto__ points to Function.prototype, instead of Object.prototype, but I'm sure there's a good reason for that :-)

I paste the code mentioned in the image here as well for if anyone wants to test it. Note that some properties are added to the objects for making easy to know where we are after some jumps:

Object.O1='';
Object.prototype.Op1=''; Function.F1 = '';
Function.prototype.Fp1 = ''; Cat = function(){};
Cat.C1 = '';
Cat.prototype.Cp1 = ''; mycat = new Cat();
o = {}; // EDITED: using console.dir now instead of console.log
console.dir(mycat);
console.dir(o);

The reason why Object.__proto__ points to Function.prototype is because Object() by itself is a native function that instantiates an empty object. Therefore, Object() is a function. You'll find that all the other major native types' __proto__ properties point to Function.prototype. Object, Function, String, Number, and Array all inherit the Function prototype.

JavaScript深入之从原型到原型链

__proto__ VS. prototype in JavaScript的更多相关文章

  1. JavaScript中__proto__与prototype的关系

    一.所有构造器/函数的__proto__都指向Function.prototype,它是一个空函数(Empty function) 1 2 3 4 5 6 7 8 9 Number.__proto__ ...

  2. JavaScript中__proto__与prototype的关系(转)

    一.所有构造器/函数的__proto__都指向Function.prototype,它是一个空函数(Empty function) 1 2 3 4 5 6 7 8 9 Number.__proto__ ...

  3. JS的__proto__与prototype

    一.prototype和__proto__的概念 prototype是函数的一个属性(每个函数都有一个prototype属性),这个属性是一个指针,指向一个对象.它是显示修改对象的原型的属性. __p ...

  4. 15条规则解析JavaScript对象布局(__proto__、prototype、constructor)

    大家都说JavaScript的属性多,记不过来,各种结构复杂不易了解.确实JS是一门入门快提高难的语言,但是也有其他办法可以辅助记忆.下面就来讨论一下JS的一大难点-对象布局,究竟设计JS这门语言的人 ...

  5. javascript--15条规则解析JavaScript对象布局(__proto__、prototype、constructor)

    大家都说JavaScript的属性多,记不过来,各种结构复杂不易了解.确实JS是一门入门快提高难的语言,但是也有其他办法可以辅助记忆.下面就来讨论一下JS的一大难点-对象布局,究竟设计JS这门语言的人 ...

  6. Javascript中的__proto__、prototype、constructor

    今天重温了下Javacript,给大家带来一篇Javascript博文,相信对于Javacript有一定了解的人都听过prototype原型这个概念,今天我们深度的分析下prototype与__pro ...

  7. javascript中构造器(函数)的__proto__与prototype初探

    背景:最近没什么需求,快要闲出屁了,所以重温了一下js的原型,结果大有收获,且偶然看到Snandy大神的<JavaScript中__proto__与prototype的关系> 这篇文章,感 ...

  8. JavaScript: __proto__和prototype

    图来源于:http://www.cnblogs.com/smoothLily/p/4745856.html 个人的理解: 1. 所有对象都有 __proto__属性,返回该对象的原型对象.例如f1由语 ...

  9. 再说javascript 的__proto__ 和prototype 属性

    过了一段时间,没写 原生的 javascript 的了,感觉天天在用框架写代码,框架写代码完全限定死了你所需要思考的东西,只是在处理一些业务逻辑,真正的代码 都感觉不会写了. 突然发现,框架用的不熟悉 ...

随机推荐

  1. java线程中的同步锁和互斥锁有什么区别?

    两者都包括对资源的独占. 区别是 1:互斥是通过竞争对资源的独占使用,彼此没有什么关系,也没有固定的执行顺序. 2:同步是线程通过一定的逻辑顺序占有资源,有一定的合作关系去完成任务.

  2. 初试 pyhton 简易采集

    一.安装软件(用eclispe 搭建好环境好,没有取省自动补全编写代码会很卡,最后选用sumblie) eclispe  用的windows 32 4.31 python  用的 4.3.3  下载地 ...

  3. memcached和redis的区别

    memcache和redis区别 memcach简介 Memcache时一个内存对象缓存系统,用于加速动态web应用程序,减轻数据库负载.它可以应对任意多个连接,使用非阻塞的网络I/O, 工作机制: ...

  4. 007-SaltStack之修改salt-minion id

    1. 需求背景 之前使用saltstack添加的主机默认使用了hostname作为salt-minion id,而主机名如果没有做规范和规划,是比较难区分属于什么业务或者机器的.我们需要修改salt- ...

  5. 使用django+rpc进行服务内部交互

    一.为什么使用rpc. 1)相比uwsgi,使用rpc的长连接可以不需要频繁创建连接,提高传输效率. 2)rpc支持同步和异步,对于不需要等待返回的消息可以不等待返回继续运行,减少客户端等待时间. 3 ...

  6. element-ui升级笔记;echarts图表100px问题

    1.element-ui的2.7以后的版本支持树形table结构的数据,考虑优化一下表格,就升级了,但是升级到最新的版本2.12发现table都出不来了,于是降级到2.7.目前功能正常,2.12的bu ...

  7. python打开文件的方式

    r 以只读模式打开文件 w   以只写模式打开文件,文件若存在,首先要清空,然后(重新创建) a    以追加模式打开(从EOF开始,必要时创建新文件),把所有要写入文件的数据追加到文件的末尾,即使使 ...

  8. 解决Eclipse中新建jsp文件ISO8859-1 编码问题

    看了许多的贴说是在eclipse --> window --> Preferences --> General --> Content Types --> text--& ...

  9. webpack多页应用

    本文主要讲了webpack怎么搭建多页应用,熟悉下webpack的基本用法. 新建文件夹,目录结构如下: 然后 cd webpack-test npm init(根目录下创建了一个pakage.jso ...

  10. POJ-2762-Going from u to v or from v to u(强连通, 拓扑排序)

    链接: https://vjudge.net/problem/POJ-2762 题意: In order to make their sons brave, Jiajia and Wind take ...