关于原型的一点总结

 

  原型(prototype)无疑是JavaScript中一个十分重要的概念,围绕着原型所涉及的原型链继承、内建对象扩展,JS表现出独特的面向对象特性。

 

     1.什么是原型
     每个JS的函数对象中都有一个默认的prototype属性,它指向的就是这个函数对象的原型对象,其初始值是一个没有自身属性“空对象”。(实际上含有指向构造函数的constructor属性以及指向Object.prototype的__proto__属性),来看:
function Test(){this.a = 'a';this.b = function(){return 'b';}
}
Test.prototype;

 

     2.对原型进行扩展
     对于这个“空”原型对象我们可以进行扩展,添加属性或方法(方法实质也是一种指向匿名函数的特殊属性)从而加强函数的功能。这与在构造函数中添加属性进行扩展的区别是,后者定义的属性在只存在于原型对象里(原型属性或方法仅此一份,类似Java中的类属性或方法)而实例对象本身并没有这个属性(实例对象可以通过原型链__proto__访问到原型的这个属性),在实际应用中的具体表现是原型对象属性具有“实时性”,一旦改变原型对象的属性所有实例对象的这个属性都会变化(因为原本就是一个东东,常说的对象函数复用就是这里啦)。
     3.利用实例属性重写原型属性
     如果原型属性和实例属性重名,实例属性具有更高优先级,JS引擎会优先查找实例属性返回。另外可以用hasOwnProperty()方法检测某属性究竟是不是自身属性。在查找某对象属性时会按照原型链进行逐级查找(一直到Object.prototype),其原理如下:
     每个对象(实例对象、构造函数、原型对象)其实都有__proto__属性。在这里,实例对象的__proto__指向自己的原型对象,构造函数的指向Function.prototype(这里将构造函数看作Function的一个实例),原型对象的__proto__指向Object.prototype(将原型对象看做Object的一个实例),原型链就是通过__proto__层层追溯,直到Object.__proto__=null,直接上图(版权归图片作者所有):

     在用for-in循环查找对象的所有属性时,结果所列出的是原型链中的所有实例属性和原型属性。那么问题来了,如何判断一个方法究竟是实例属性还是原型属性呢,这里可以用到obj.hasOwnProperty(propName).另外还可“迂回”通过:propertyIsEnmuberable(propName)方法来判断。

function Triangle(a,b,c){this.a = a;this.b = b;this.c = c;this.sides = [a,b,c];this.Perimeter = function(){return this.a+this.b+this.c;}
}
Triangle.prototype.dimension = '2d';
Triangle.prototype.getPoints = function(){return '3';
}

 

     4.isPropertyOf( )方法和__proto__
     prototype.isPropertyOf(obj)可用于判断一个实例对象是否是另一个对象的原型,这个方法也可用于判断继承关系(原型链继承的实现就是将子类构造函数的原型对象指向父类的一个实例对象)。
  5.利用原型扩展内建对象
     我们可以利用扩展的工作原理,对一些内建的构造函数(如Array,String)进行一些扩展,使之具备一些自定义的属性或方法。
     例如,字符串中并没有反转方法,我们可以对其原型进行扩展来添加这种方法,这里借助了数组的反转方法String.reverse()
String.prototype.reverse = function(){Array.prototype.reverse.apply(this.split('').join(''));
}

  当然这种修改内置对象的做法有可能会导致第三方库在使用内置对象时产生一些错误,或是导致新出现的内置方法被我们的修改覆盖,这时最好在添加前先做一下判断该属性是否已经存在。

 

6.重写原型对象时的坑
  为毛要重写原型?因为很多情况下要实现另一种继承方式。不是已经有原型链继承了么?没错,但是原型链继承方式的子类实例会共享父类实例的引用值属性,两个新new的子类实例如果一个改变了自己的引用属性另一个实例会同样变化(仅限引用值属性,基本值属性还是独立的),所以这个缺陷导致此种继承能应用受限!!!
     重写原型对象时注意重置constructor属性,因为新建的对象一般是作为Object的实例而单独存在其prototype.constructor默认指向Object( )(当然也可能是其他已知实例,但同样需要调整防止重写后原型依然指向原来的构造函数).ES5中可以用Object.getPropertyOf( )来检测其自身原型对象究竟是神马。
好了,关于原型的一点总结暂告段落,文中如有错误和不规范的地方还请各位朋友多多指正,谢过先!

 

转载于:https://www.cnblogs.com/mengda1027/p/4497027.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/471992.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python canopen_Python canopener包_程序模块 - PyPI - Python中文网

用于打开文件的python便利函数canopener(filename, moder)。本地文件的行为与open():>>> canopener(local_file.txt)url也可以作为文件名传递并打开进行读取。urllib2.urlopen()是在封面下使用的,因此它具有同等的支持:>>>…

python自动化pdf报告_[Python] 自动化办公 PDF提取文字、表格、图片

转载请注明:陈熹 chenx6542foxmail.com (简书号:半为花间酒)若公众号内转载请联系公众号:早起Python本例可以学到的知识点:使用 pdfplumber 提取 PDF 中的文字和表格使用 fitz 提取 PDF 中的图片之前我们已经详细介绍了批量 PDF 文…

天池 在线编程 最长AB子串(哈希)

文章目录1. 题目2. 解题1. 题目 描述 给你一个只由字母’A’和’B’组成的字符串s&#xff0c;找一个最长的子串&#xff0c;要求这个子串里面’A’和’B’的数目相等&#xff0c;输出该子串的长度。 这个子串可以为空。 s的长度n满足 2<n<1000000。示例 样例1 输入: s…

Tomcat 打开一闪而过

转载于:https://www.cnblogs.com/super90/p/4504326.html

java怎么递归_Java的递归、如何与流相结合

递归技术需求&#xff1a;扫描D:\test所有子文件夹及子子文件夹下的.jpg文件。我们如果用循环来做这件事&#xff0c;我们不知道循环的结束条件&#xff0c;也不知道到底有多少层&#xff0c;所以比较麻烦。我们可以用一种新的思想&#xff1a;递归。递归举例&#xff1a;从前有…

假设有搅乱顺序的一群儿童成一个队列_数据结构与算法系列之栈amp;队列(GO)...

以下完整代码均可从这里获取栈栈的基本概念「后进先出、先进后出就是典型的栈结构」。栈可以理解成一种受了限制的线性表&#xff0c;插入和删除都只能从一端进行当某个数据集合只涉及在一端插入和删除数据&#xff0c;并且满足后进先出、先进后出的特性&#xff0c;就应该首选…

python 自定义类(特殊方法)

文章目录1. 对象表示形式2. 可散列的类3. 私有属性的利弊4. __slots__ 类属性节省空间5. 覆盖类属性learn from 《流畅的python》 from array import array import mathclass Vector2D:typecode d # 类属性def __init__(self, x, y):self.x float(x)self.y float(y)classm…

网络知识

http://www.cnblogs.com/dawen/archive/2011/05/18/2050358.html http://www.cnblogs.com/daoluanxiaozi/p/3274925.html转载于:https://www.cnblogs.com/webundle/p/4505782.html

datagridview 动态插入图片_挑战一张照片制作动态PPT背景

在PPT中&#xff0c;要做出好看的页面动画效果&#xff0c;常常需要用很多图片和装饰元素。而如果你手头的素材只有一张照片&#xff0c;如何才能快速做出好看的PPT背景效果呢&#xff1f;本期内容&#xff0c;我们就来一起挑战&#xff0c;使用一张照片&#xff0c;制作PPT动态…

sed搜索某行在行末追加_示范sed指定某行插入 追加和全局替换

有时候会有这样的需求&#xff0c;在指定的行后面或者是前面追加一行&#xff0c;这个时候可以使用sed来完成&#xff0c;具体用法如下a\ 在指定的行后面追加一行b\ 在指定的行前面追加一行使用指定的行号追加内容&#xff0c;在使用行号的过程中&#xff0c;需要注意的问题有以…

LeetCode 1941. 检查是否所有字符出现次数相同

文章目录1. 题目2. 解题1. 题目 给你一个字符串 s &#xff0c;如果 s 是一个 好 字符串&#xff0c;请你返回 true &#xff0c;否则请返回 false 。 如果 s 中出现过的 所有 字符的出现次数 相同 &#xff0c;那么我们称字符串 s 是 好 字符串。 示例 1&#xff1a; 输入&…

java初学者定远期目标_JAVA题,新手求解

展开全部类图设计&#xff1a;类设计&#xff1a;package car;public class Car {private String id;private String name;public void setId(String id) {this.id id;}public void setName(String name) {this.name name;}/*** 获取汽车编e69da5e6ba9062616964757a686964616…

LeetCode 1942. 最小未被占据椅子的编号(set)

文章目录1. 题目2. 解题1. 题目 有 n 个朋友在举办一个派对&#xff0c;这些朋友从 0 到 n - 1 编号。 派对里有 无数 张椅子&#xff0c;编号为 0 到 infinity 。 当一个朋友到达派对时&#xff0c;他会占据 编号最小 且未被占据的椅子。 比方说&#xff0c;当一个朋友到达时…

python哪本书好看_python入门看哪本书好

推荐几本适合python初学者的书。《Python编程 从入门到实战》本书中涵盖的内容是比较精简的&#xff0c;没有艰深晦涩的概念&#xff0c;最重要的是每个小结都附带有”动手试一试”环节&#xff0c;学编程最佳的方式就是多动手、多动脑。很多初学者看完书之后不知道下一步怎么办…

java mysql geo_GEO数据库简介

为了支持公共使用和散布基因表达数据&#xff0c;NCBI开始了基因表达汇编(GEO)计划。GEO是努力建立一个基因表达数据仓库和在线资源&#xff0c;用于从任何物种或人造的来源检索基因表达数据。来自microarray&#xff0c;高密度寡核苷酸array(HAD)&#xff0c;杂交膜(filter)和…

对每个小组的评论和建议

1、极速蜗牛&#xff1a;总体上已经有了一个小游戏的基本轮廓&#xff0c;虽然还没有达到预期的效果&#xff0c;但是能看到他们的进度。不过这次我们只看到了一直在反弹&#xff0c;对于一个游戏来说&#xff0c;娱乐性是很重要的&#xff0c;但是在这个游戏中我们没有看到很大…

vue路由懒加载_优化vue项目的首屏加载速度

最近使用vue-cli3构建了一个小型的博客系统&#xff0c;完工之后&#xff0c;build打包出来发现一个chunk-vendors包就有1.1m&#xff0c;部署上去之后&#xff0c;访问的时候&#xff0c;首屏加载非常慢。居然需要21s&#xff0c;体验极差。这是打包的结果截图根据这种情况&am…

LeetCode 1943. 描述绘画结果(差分思想)

文章目录1. 题目2. 解题1. 题目 给你一个细长的画&#xff0c;用数轴表示。 这幅画由若干有重叠的线段表示&#xff0c;每个线段有 独一无二 的颜色。 给你二维整数数组 segments &#xff0c;其中 segments[i] [starti, endi, colori] 表示线段为 半开区间 [starti, endi) 且…

java浏览器拖拽_使用Java强制移动浏览器缩小

在我的网络应用中&#xff0c;我有一些缩略图&#xff0c;可在单击时打开一个灯箱。 在移动设备上&#xff0c;缩略图很小&#xff0c;用户通常会放大。问题是&#xff0c;单击播放时&#xff0c;灯箱在可见区域之外(他们必须滚动到灯箱才能观看视频)。 是否可以强制移动浏览器…

Git学习笔记01--初始化设置

1、查看git版本 $ git --version 2、设置用户姓名和邮箱 $ git config --global user.name “Craftor” $ git config --global usrer.email “craftor0924gmail.com” 3、设置命令别名 $ git config --system alias.st status $ git config --system alias.ci commit $ git co…