最近折腾了好久,终于是把js里面的原型和原型链做了个初步的理解;

在这里,我打个比喻:

我(child),我妈constructor(构造函数)生了我;别人问我老妈跟谁生的我,于是此时我妈会指向我爸爸(father),即constructor.prototype=father。

而我的爸爸可以表示为:child.__proto__;故又有了constructor.prototype===child.__proto__;

这时候,有人会问,__proto__这是什么,这就是构成原型链的一个引用,如child.__proto__,此时它可以理解为,生我的人,我爸爸;层层的关系,儿子、父亲、爷爷,之间的这些__proto__,就构成了所谓的原型链;

另外,我需要注意的是,我可以借用父亲或者爷爷的所有成员属性,一旦需要用到,发现自己没有的情况下,可以延着原型链__proto__逐级往上找,找到就可以借用,找不到,就抛出undefined。

而母亲constructor构造函数一切有的成员属性,我都是同时也拥有的,母亲构造我的时候,就赋予了我这些成员属性,再次见证了母爱的伟大!

以下是一张很好的对象原型关系图,结合上面的理解再来看这个图,就很清晰啦:

最后,这是我的初步理解,有错误的地方,请多多指教!!

javascript 原型及原型链的初步理解的更多相关文章

  1. 【JavaScript】深入理解JavaScript之强大的原型和原型链

    由于JavaScript是唯一一个被广泛使用的基于原型继承的语言,所以理解两种继承模式的差异是需要一定时间的,今天我们就来了解一下原型和原型链. AD: hasOwnProperty函数: hasOw ...

  2. 对Javascript 类、原型链、继承的理解

    一.序言   和其他面向对象的语言(如Java)不同,Javascript语言对类的实现和继承的实现没有标准的定义,而是将这些交给了程序员,让程序员更加灵活地(当然刚开始也更加头疼)去定义类,实现继承 ...

  3. <深入理解JavaScript>学习笔记(5)_强大的原型和原型链

    前言 JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型. (prototypal :原型.学好英语还是很重要的) 虽然这经常被当作是 JavaScript 的缺点 ...

  4. 深入理解JavaScript系列(5):强大的原型和原型链

    前言 JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型. 虽然这经常被当作是 JavaScript 的缺点被提及,其实基于原型的继承模型比传统的类继承还要强大.实 ...

  5. javascript系列--认识并理解构造函数,原型和原型链

    一.前言 介绍构造函数,原型,原型链.比如说经常会被问道:symbol是不是构造函数:constructor属性是否只读:prototype.[[Prototype]]和__proto__的区别:什么 ...

  6. 如何理解JavaScript的原型和原型链

    在现在的业务开发中,应该很少人在写原生JavaScript了,大家都一股脑地扑在各个框架上.本来,这些框架对于业务和开发者来说是一种福音,减少了各种各样的开发痛点,但是带来的负面问题就是对于开发者来说 ...

  7. javascript原型与原型链个人理解

    想了解原型和原型链,我觉得首先我们得知道javascript里有一个Object 与 Function,它俩都是构造函数,当然函数也是一个对象.我们打印Object 与 Function看一下, co ...

  8. 上帝视角一文理解JavaScript原型和原型链

    本文呆鹅原创,原文地址:https://juejin.im/user/307518987058686/posts 前言 本文将从上帝角度讲解JS的世界,在这个过程中,大家就能完全理解JS的原型和原型链 ...

  9. [我的理解]Javascript的原型与原型链

    一.原型与原型链的定义 原型:为其他对象提供共享属性的对象 注:当构造器创建一个对象,为了解决对象的属性引用,该对象会隐式引用构造器的"prototype"属性.程序通过const ...

随机推荐

  1. iOS 对象的内存管理细节

    通过类创建对象 1.创建对象时,开辟存储空间,通过new方法创建的对象会在 堆 内存中开辟一块存储空间 2初始化所有属性都在堆内存中完成 3.返回值真地址,指针在栈内存中,指针指向的地址是堆里创建对象 ...

  2. 【mongo】mongoVUE使用

    1.查询存在字段"test"的项 {"test":{$exists:true}} 2.在表中插入字段 {$set:{"}} 3.正则匹配 {" ...

  3. MVC -- 后台RedirectToAction传递实体类与字符串

    1.MVC -- 后台RedirectToAction传递实体类 RedirectToAction(控制器,控制器方法,实体类) 2.MVC -- 后台RedirectToAction传递字符串 Re ...

  4. there's no qt version assigned to this project for platform

    VS+Qt编译一个新建的项目报there's no qt version assigned to this project for platform xxx的错误. 解决方案: 打开Qt_vs_add ...

  5. 【笔记】MySQL查询排名

    select a.name, a.total_score,@rank:=@rank+1 as rank from (                  select u.name,uti.total_ ...

  6. LINUX命令批量替换文件中的字符串

    sed -i "s/abcd/1234/g" `grep abcd -rl /home/data` find /data/web  -type f -exec  sed -i 's ...

  7. 使用sublimehighlight 将文本 转化html

    a = "aaa" b = "bbb" c = "ccc" final = a + b + c print final import sys ...

  8. DevExpress.XtraEditors.xtraScrollableControl

    DevExpress.XtraEditors.xtraScrollableControl里面加一个有高度的控件就有滚动条了

  9. URL

    URL的格式:protocol :// hostname[:port] / path / [;parameters][?query]#fragment URL出现了有+,空格,/,?,%,#,& ...

  10. 学习微信小程序之css6