js原型链理解(2)--原型链继承
1.原型链继承
2.constructor stealing(构造借用)
3.组合继承
js中的原型链继承,运用的js原型链中的__proto__。
function Super(){
this.set = "set";
}
Super.prototype.age = 10;
function Sub(){
this.name = 100;
}
Sub.prototype = new Super();
var subs = new Sub();
console.log(subs.age);
console.log(subs.name);
console.log(subs.set);

解释1:
Sub构造继承了Super构造的原型对象和构造属性。Sub.prototype 右边赋值了new Super();获取了new Super(),一个对象,这个对象的结构是这样的

那么subs这个对象在获取属性或者方法的时候,想要获取age的时候,就会去Sub的构造里面查找,没有找到,继续去prototype里面去查找,也没有这个属性。
但是在 /原型链理解(1) 里面我们已经知道了,(一个对象拥有__proto__拥有的所有属性(会根据__proto__指针向上查询)),subs会继续去Sub.prototype拥有的__proto__指向的Super.prototype里面查询,那么这个age属性的值就是10,
这个值其实是在Super的原型对象里,引用。
解释2:
subs是如何获取到set这个值的呢?subs先从Sub的构造里面找,找不到就去Sub.prototype里面找 Sub.prototype = { set : "set", __proto__ },就得到了这个set值,已经是一个实例化的值( new Super()),并不是引用。 所以只要一个构造的原型对象
是另一个构造的对象,它就继承了另一个构造的所有属性。一层一层向上获取值,这个继承就可以是无限的。
主要是其中对象的 __proto__ 在起中间作用。
需要注意的是,Sub构造在继承Super构造的属性时,会去生成一个全新的值,并不是引用。 Sub.prototype = { set : "set", __proto__ },这个时候 任何从子构造Sub创建的对象的set都是从prototype里面引用获取的。
如果这个值是引用类型,那么,值一旦被修改,Sub.prototype.set这个值就被修改了。再创建其他对象,这个set值是被修改的值。而且构造里面的值全都一样,一次创建,处处相同。那么想要不同属性值的构造值,必须重写一个构造
,无法使用继承实现,即使方法相同。所以有constructor stealing(构造 偷窃)借用,来让子构造初始化不同的值。
最后画一下原型链继承的图,它是如何一层层向上查询的

解释3:subs.constructor 其实是Super,因为如果Sub.prototype没有被重写,subs.constructor指向的是Sub构造函数(prototype自带的属性),但是它被new Super()赋值以后,它的constructor就会去从Super实例的对象去寻找。实例的对象会从__proto__里面查询,
在它的原型对象里面找到这个constructor指针,指向Super。上面的图上面可以看出来。所以subs的构造函数其实是Super
js原型链理解(2)--原型链继承的更多相关文章
- js原型链理解(3)--构造借用继承
构造借用(constructor strealing) 1.为什么已经存在原型链继承还要去使用构造借用 首先看一下这个例子 function Super(){ this.sets = [0,1,2]; ...
- 通过JavaScript原型链理解基于原型的编程
零.此文动机 用了一段时间的Lua,用惯了Java C++等有Class关键字的语言,一直对Lua的中的面向对象技术感到费解,一个开源的objectlua更是看了n遍也没理解其中的原理,直到看到了Pr ...
- 深入理解javascript原型和闭包系列
从下面目录中可以看到,本系列有16篇文章,外加两篇后补的,一共18篇文章.写了半个月,从9月17号开始写的.每篇文章更新时,读者的反馈还是可以的,虽然不至于上头条,但是也算是中规中矩,有看的人,也有评 ...
- 深入理解javascript原型和闭包 (转)
该教程绕开了javascript的一些基本的语法知识,直接讲解javascript中最难理解的两个部分,也是和其他主流面向对象语言区别最大的两个部分--原型和闭包,当然,肯定少不了原型链和作用域链.帮 ...
- 深入理解javascript原型和闭包(完结)
原文链接:http://www.cnblogs.com/wangfupeng1988/p/3977924.html 说明: 该教程绕开了javascript的一些基本的语法知识,直接讲解javascr ...
- 深入理解javascript原型和闭包
目录: 深入理解javascript原型和闭包(1)——一切都是对象 深入理解javascript原型和闭包(2)——函数和对象的关系 深入理解javascript原型和闭包(3)——prototyp ...
- 深入理解javascript原型和闭包(转)
深入理解javascript原型和闭包(完结) 说明: 该教程绕开了javascript的一些基本的语法知识,直接讲解javascript中最难理解的两个部分,也是和其他主流面向对象语言区别最大的 ...
- 转:深入理解javascript原型和闭包系列
转自:深入理解javascript原型和闭包系列 从下面目录中可以看到,本系列有16篇文章,外加两篇后补的,一共18篇文章.写了半个月,从9月17号开始写的.每篇文章更新时,读者的反馈还是可以的,虽然 ...
- 【前端知识体系-JS相关】深入理解JavaScript原型(继承)和原型链
1. Javascript继承 1.1 原型链继承 function Parent() { this.name = 'zhangsan'; this.children = ['A', 'B', 'C' ...
随机推荐
- Oracle 提取数据表信息
参考: https://www.progress.com/blogs/jdbc-tutorial-extracting-database-metadata-via-jdbc-driver http:/ ...
- 【MAVEN】maven项目下载更新pom jar包速度慢 解决方案
1·下载安装 最新版本的maven https://maven.apache.org/download.cgi 2·速度慢的主要原因是因为默认setting.xml里配置的国外的 maven 数据源 ...
- [翻译]使用Visual Studio Code怎样调试Rust
我将 Visual Studio Code 作为Rust首选编辑器.遗憾的是 VS Code 不能非常好地完成 Rust 的调试. 配置调试器不难,但仍然需要几个步骤.我已经完整配置了好几次.我正在写 ...
- 让Nutz支持最快的模板引擎Smarty4j
Smarty4j是一个开源的模板引擎.没错,它就是著名的php模板引擎之Java移植版. 它特点就是将模板文件或者字符串编译成java类直接执行,所以效率比一般的模板解释的方式处理要快.它发展较晚,所 ...
- asp.net+bootstrap上传图片+FileUpload控件文件上传下载
ps:我数据库使用的pgsql,看个人修改. 代码asp.net 的,使用了mootools框架,里面包含了bootstrap上传图片,查看预览,还加了个上传任意文件的FileUpload.(界面随便 ...
- arm linux 移植支持 HP打印机
背景 由于业务需要,需要hi3531d主板上加入对于HP打印机的支持. 通过与产品经理,技术主管的沟通:通用支持是不现实的,只要求彩色打印,先不考虑打印机的价格,只要支持一款打印机即可. 注意: Li ...
- Elasticsearch的快速使用——Spring Boot使用Elastcisearch, 并且使用Logstash同步mysql和Elasticsearch的数据
我主要是给出一些方向,很多地方没有详细说明.当时我学习的时候一直不知道怎么着手,花时间找入口点上比较多,你们可以直接顺着方向去找资源学习. 如果不是Spring Boot项目,那么根据Elastics ...
- hue中访问hdfs报错
在hue中访问hdfs报错: Cannot access: /. Note: you are a Hue admin but not a HDFS superuser, "hdfs" ...
- 无聊看看c是咋写游戏的
/* 项目名称:五子棋, vs */ /* 绘图环境,初始化游戏 1.绘图环境(窗口) 2.背景图片 3.背景音乐 4.绘制棋盘 */ #include"pch.h" #inclu ...
- Rabbitmq与spring整合之重要组件介绍——rabbitAdmin组件
rabbitAdmin组件是一个管理组件,主要是用户通过该组件进行rabbitmq的队列交换器虚拟主机等等进行操作.这里面有些教程说不用声明可以直接绑定,但是本博主运行时,不生命情况下就会报错,可能是 ...