JavaScript学习笔记之constructor,prototype,__proto__解惑

引言

在学习JavaScript时,不可避免的接触到了原型原型链的概念,结果被constructorprototype__proto__这些属性搞得一脸懵逼,这些都是什么鬼!!!通过谷歌浏览器调试时,看对象实例的内部结构,这三个属性也是你中有我,密不可分,完全理不清头绪。最后通过理清概念,不断验证,最终有了一些思路。

概念

要想真正弄清楚constructorprototype__proto__这些属性的之间的区别和联系,首先我们要明确定义:

  • constructor属性始终指向创建当前对象的构造函数
  • prototype属性是每个函数对象都具有的属性,被称为原型对象,因为其本身也是个对象。
  • __proto__属性是每个对象具有的属性。一旦原型对象被赋予属性和方法,那么由相应的构造函数创建的实例对象会继承prototype上的属性和方法。

事例

下表列出了实例对象和函数对象的区别:

constructor prototype __proto__
A ✔︎ ✔︎ ✔︎
a ✔︎ ✔︎

由上表可以看出实例对象是没有prototype属性的,只有函数对象才有(这一点很重要!!!),下面用代码来具体解释下以上三个属性的关系:

<script type="text/javascript">
    function A() {};
   
    var a = new A();
</script>

JavaScript实际上执行的是:

<script type="text/javascript">
    function A() {};

    var a = new Object();
    a.__proto__ = A.prototype;
    A.call(a);
</script>

其中A.prototype也是个对象,它由constructor__proto__属性组成 (这一点很重要!!!),它的构造过程如下:

A.prototype = new Object();
A.prototype.constructor = A;
A.prototype.__proto__ = Object.prototype;

ObjectFunction原型对象

  • JavaScript中的所有对象都来自Object,所有对象从Object.prototype继承方法和属性,尽管它们可能被覆盖。例如,其他构造函数的原型将覆盖constructor属性并提供自己的toString()方法。Object原型对象的更改将传播到所有对象,除非受到这些更改的属性和方法沿原型链进一步覆盖。它的构造过程如下:

    Object.prototype = new Object();
    Object.prototype.constructor = Object;
    Object.prototype.__proto__ = null;
    
    ...
    
    Object.__proto__ = Function.prototype;
    
  • 全局的Function对象没有自己的属性和方法, 但是, 因为它本身也是函数,所以它也会通过原型链从Function.prototype上继承部分属性和方法。Function实例从Function.prototype 继承了一些属性和方法。 同其他构造函数一样, 你可以改变构造函数的原型从而使得所有的Function实例的属性和方法发生改变。它的构造过程如下:

    Function.prototype = new Function();
    Function.prototype.constructor = Function;
    Function.prototype.__proto__ = Object.prototype;
    
    ...
    
    Function.__proto__ = Function.prototype;
    

验证

我们通过谷歌浏览器来进行调试,来验证我们的结论,先来看下Object原型对象,如下图:

再来看下Function原型对象,如下图:

最后看下a_a实例对象,如下图:

测试代码

红框框住的部分就是所谓的原型链,原型链中的方法,实例对象a_a都可以访问,JavaScript也是用原型链来实现继承的。

另外,还有一件有趣的事情,如下图:

无限递归

可以无限延展下去,是不是很有趣,有兴趣的同学可以试一下,可以加深你对这三个属性的理解,哈哈😄。

结语

关于怎么用原型和原型链来实现继承,网上有很多好的博文供大家参考,大家也可以参考以下链接,我在这里就不再废话了。本文如有错误,希望指正,不胜感激!

参考链接

https://segmentfault.com/a/1190000000662547
https://segmentfault.com/a/1190000003017751
http://blog.jobbole.com/9648/

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,117评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,328评论 1 293
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,839评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,007评论 0 206
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,384评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,629评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,880评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,593评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,313评论 1 243
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,575评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,066评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,392评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,052评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,082评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,844评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,662评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,575评论 2 270

推荐阅读更多精彩内容

  • 在JavaScript中,原型链作为一个基础,老生长谈,今天我们就来深入的解读一下原型链。 本章主要讲的是下面几点...
    Devinnn阅读 1,371评论 1 6
  • 基本概念 先用构造函数创建一个对象 在这个例子中,Person 就是一个构造函数,我们使用 new 创建了一个实例...
    杰哥长得帅阅读 485评论 0 2
  • 普通创建对象和字面量创建对象不足之处:虽然 Object 构造函数或对象字面量都可以用来创建单个对象,但这些方式有...
    believedream阅读 2,310评论 2 18
  • 吊扇轻轻转动,炎热的天气没有一丝得到改善,窗外的街道像是被高温扭曲,平坦的直路变得凹凸不平,大约是太热了,一件白色...
    刘月霞snow阅读 305评论 0 0
  • 今年忽然间迷恋上了香水。 发端似乎是偶然整理衣服,衣物太多全部乱腾腾的压在衣柜前,柜门未合。夜里睡觉的时候隐约闻见...
    梨苒阅读 195评论 0 0