JS进阶系列之原型、原型链
最近在看 JavaScript忍者秘籍 这本书的时候,再加上最近遇到的关于原型、原型链的面试题,所以萌生了要把这些知识梳理一遍的想法,所以以下是我自己对原型、原型链的看法
什么是原型
提到原型,我们可能都会想到与对象有关的东西,但其实,原型是与函数才是密切相关的。每当我们创建一个函数,都会有一个指向该函数的原型对象的指针prototype,然后该原型对象上又有一个指向该函数的指针constructor,在这里,如果我们这个函数是一个构造函数,那么我们每实例化一个对象,该对象都会有一个指向该构造函数的原型对象的指针_proto_,那么我就以一个小的例子来讲解一下原型对象,构造函数与实例的关系。
function Ninja(){
this.swung = true;
this.swingSword = function(){
return !this.swung;
}
}
Ninja.prototype.swingSword = function(){
return this.swung;
};
var ninja = new Ninja();
从图中可以看出,通过构造函数Ninja()创建了一个对象,并且这个对象的引用是一个变量ninja,然后该构造函数,又有一个指向它的原型对象的属性prototype。
谈到原型,接下来就是原型对象的几个知识点。
- 如果给对象实例添加了一个与原型对象中的某个同名属性,该对象实例上的这个属性会覆盖原型对象上的属性,我们可以通过代码来演示:
function Ninja(){
this.swung = true;
this.swingSword = function(){
return !this.swung;
}
}
Ninja.prototype.swingSword = function(){
return this.swung;
};
var ninja = new Ninja();
ninja.swingSword();//false
因为每次访问实例中的属性是,都是一个向上查找的过程,会先从实例对象上查找有无这个属性,如果有,就返回这个属性,如果没有,就会继续往它的原型对象上找,一层层往上寻找,如果没有,就返回undefined。
- 如果我们先实例化了一个对象实例,然后再改变了它的原型对象,这个改变会反映在这个对象实例上,因为原型对象上的改变会实时反应在每一个对象实例上,这也是原型对象的重要特性之一,代码演示实例如下:
function Ninja(){
this.swung = true;
}
Ninja.prototype.swingSword = function(){
return this.swung;
};
var ninja = new Ninja();
Ninja,prototype.swingSword = function(){
return !this.swung;
}
ninja.swingSword();//false;
什么是原型链
原型链与javascript中的继承密切相关,可以说,继承是通过原型链来实现的。原型链可以理解为一个对象的实例是另一个对象的原型,然后另一个对象的实例又是另一个对象的原型,依次类推形成的一个链式结构
所以一般实现继承的方式是:将父类的实例作为子类的原型,用下面这个例子来讲解一下
function Person(){};
Person.prototype.dance = function(){};
function Ninja(){};
Ninja.prototype = new Person();
var ninja = new Ninja();
从图片可以看出,让Person的一个实例作为子类Ninja对象的原型,这样,Ninja就继承了Person上的所有属性和方法,包括构造函数上的还有原型上的,这就是原型链实现继承的方法。
那么为什么我们不直接将父类的原型对象直接赋给子类的原型对象呢,那是因为如果我们这样做的话,对子类原型对象的改变,将会直接影响到了父类中的原型对象,这是一个不可取的方法。
JS进阶系列之原型、原型链的更多相关文章
- 【 D3.js 进阶系列 】 进阶总结
进阶系列的文章从去年10月开始写的,晃眼又是4个多月了,想在年前总结一下. 首先恭祝大家新年快乐.今年是羊年吧.前段时间和朋友聊天,聊到十二生肖里为什么没猫,我张口就道:不是因为十二生肖开会的时候猫迟 ...
- 【 D3.js 进阶系列 — 4.0 】 绘制箭头
转自:http://www.ourd3js.com/wordpress/?p=660 [ D3.js 进阶系列 — 4.0 ] 绘制箭头 发表于2014/12/08 在 SVG 绘制区域中作图,在绘制 ...
- JS进阶系列之作用域链
在之前写的进阶系列里面,提到了执行上下文在创建阶段,要创建变量对象.确定作用域链还有确定this的指向,本次将重点讲解一下作用域链. JavaScript代码的执行过程 在讲解作用域链之前,首先了解一 ...
- 【 D3.js 进阶系列 — 1.1 】 其它表格文件的读取
CSV 表格文件是以逗号作为单元分隔符的,其他还有以制表符 Tab 作为单元分隔符的 TSV 文件,还有人为定义的其他分隔符的表格文件.本文将说明在 D3 中怎样读取它们. 1. TSV 表格文件是什 ...
- 【 D3.js 进阶系列 — 1.2 】 读取 CSV 文件时乱码的解决方法
在 D3 中使用 d3.csv 读取 CSV 文件时,有时会出现乱码问题. 怎么解决呢? 1. 乱码问题 使用 d3.csv 读取 xxx.csv 文件时.假设 xxx.csv 文件使用的是 UTF- ...
- js基础系列之【原型和原型链】
声明:形成本文的出发点仅仅是个人总结记录,避免遗忘,并非详实的教程:文中引用了经过个人加工的其它作者的内容,并非原创.学海无涯 引入问题 一般我们是这样写的: (需求驱动技术,疑问驱动进步) // 构 ...
- JS进阶之---作用域,作用域链,闭包
一.作用域: 在JavaScript中,我们可以将作用域定义为一套规则,这套规则用来管理引擎如何在当前作用域以及嵌套的子作用域中根据标识符名称进行变量查找.这里的标识符,指的是变量名或者函数名. Ja ...
- JS进阶系列之内存空间
也许很多人像我一样,觉得JS有垃圾回收机制,内存就可以不管了,以至于在全局作用域下定义了很多变量,自以为JS会自动回收,直到最近,看了阮一峰老师,关于javascript内存泄漏的文章时,才发现自己写 ...
- 【 D3.js 进阶系列 — 6.1 】 缩放的应用(Zoom)
缩放(Zoom)是另一种重要的可视化操作,主要是使用鼠标的滚轮进行. 1. zoom 的定义 缩放是由 d3.behavior.zoom() 定义的. var zoom = d3.behavior.z ...
随机推荐
- LeetCode559. Maximum Depth of N-ary Tree
第一次写出了具有迭代和递归的函数,还是有点收获的,虽然题目比较简答 当要对某些对象重复使用时,考虑循环,也就是迭代 当函数可以简化一个重复的操作时,考虑递归,而且就当下一次使用这和函数的结果已经有啦, ...
- scikit-learn决策树的python实现以及作图
decsion tree(决策树) 其中每个内部结点表示在一个属性上的测试,每个分支代表一个属性的输出,而每个树叶结点代表类或类的分布.树的最顶层是根节点 连续变量要离散化 机器学习中分类方法的一个重 ...
- 公司架构理解 - 千万 pv 网站
1.面试题 - 花架构图 commander 控制台,请求处理器 crp 资源分配器 相当于仓管 .推荐系统的架构流程图和每一个模块的作用一定要了解,一般会让你一边画流程图一边讲解每个模块. 2.我自 ...
- FFMpeg笔记(二) 使用FFmpeg对视频进行编解码的一般流程
1. 编码: 1.对编码资源的初始化 AVCodec* m_pVideoEncoder;// 特定编码器的参数信息 AVCodecContext* m_pVideoEncoderContext;// ...
- 【css】box-shadow匹配ps投影效果/text-shadow
参照资料:http://blog.csdn.net/lpandeng/article/details/72778451 box-shaow: 距离(x-offset y-offset) 虚影(blu ...
- linux文件系统初始化过程(6)---执行init程序
一.目的 内核加载完initrd文件后,为挂载磁盘文件系统做好了必要的准备工作,包括挂载了sysfs.proc文件系统,加载了磁盘驱动程序驱动程序等.接下来,内核跳转到用户空间的init程序,由ini ...
- SQL语句查询关键字中含有特殊符号怎么处理, 例如 'SMI_'
SQL语句查询关键字中含有特殊符号怎么处理, 例如 'SMI_' 错误:select * from emp where ename like '%SML_%' 正确:select * from em ...
- 偏前端 - jquery-iframe内触发父窗口自定义事件-
例如父窗口定义了一个事件. top: $(dom1).bind('topEvent', function(){}); 那么iframe里面的元素怎样触发父窗口dom1的事件呢?这样吗? $(dom1, ...
- linux定时任务-crontab
使用场景: 有时候线上服务器挂了,或者一些数据推送不正常,一般来说我们需要做的就是将项目重启运行,或者检查核对出问题的位置,来快速解决,很多时候我们不得不登上服务器来查看,这个对于目前工作日益繁忙的我 ...
- Mongodb基础知识笔记
MongoDB介绍 MongoDB是一个基于分布式文件存储的开源文档数据库.由C++语言编写.旨在为WEB应用提供高性能.高可用性和高伸缩数据存储解决方案. MongoDB优点 MongoDB使用场景 ...