js关于propotype的一些事-------Day62
近期在忙着搬家,忙忙活活的收拾这收拾那,原以为自己东西了了,谁知道东西是越收拾越多,各种崩溃啊.....
昨日在记录js动态生成表格的经典方式时,用到了createDocumentFragment(),还感觉自己又学到了新东西,结果回头看过去记录的时候,惊奇的发现自己原来在非常早的时候就记录过一次了,好悲哀,仿佛又回到了那个“好脑子不如烂笔头”的年代,看来烂笔头也还得要多翻看啊。
在这个应用中还用到了一个经典的“propotype”,这里来记录下:
1、propotype的概念
在w3cshool中,这样来解释的:propotype属性使你有能力向对象加入属性和方法。
另一些介绍这样来描写叙述:如今有一个类A,我想要创建一个类B,这个类是以A为原型的,而且能进行扩展,则我们称B的原型为A;
在了解一些相关知识后,我们回过头来看w3cshool中的解释,确然是言简意赅,合适至极,尽管在初始的时候让我纠结了半天;
2、propotype的定义
在进行这个问题的时候先来记录下javascript的方法类型:
a、类方法
function createTable(){
this.tableRowNum=10;
this.show=function(){
alert(1);
};
};
b、对象方法
createTable.introduce=function(){
alert("这是个表格");
};
c、原型方法
createTable.propotype.introduce=function(){
alert("这又是一个表格");
}
在这里我们先介绍了javascript的这三种方法,目的就是为了能够看得更明确一些,第三个方法是原型方法,也就是我们所说的原型的定义,其实,广义的来说我们所说的原型定义还是属于对象定义的范畴,createTable.propotype看做一个对象的话,并且其实也确实是一个对象,这个我们能够写方法进行证明:function a(){},alert(a.propotype);
我们再来回顾一个对象的定义在java中通常是怎样定义的,定义其属性和方法,createTable是一个对象,它有它的方法,而createTable.propotype能够看做为一个对象的话,则就是它的属性,而原型就是对它属性的方法,而通过改变它的属性相同能够改变原始对象,这是显而易见的。
这样应该可以能简单的理解下原型方法是怎样定义了吧。
3、propotype的应用
a、给propotype加入属性
这个相比較来说比較简单,像:
function book(){
this.bookPage=10;
}
book.propotype.add=function{
this.bookName="加油";
}
通过上面的定义我们知道,改变它的属性的方法,则相同会改变对象本身,假设生成一个实例的话,则这里就会含有两个属性了,bookPage和bookName;
b、用propotype给对象加入函数
这个在生成表格中就应用到了,像加入行和列;事实上对对象属性加入的方法,仍然是对原对象进行加入
4、个人的一些总结(可能会有偏颇,希望能够给指正)
通过应用中我们能够得出,我们对于对象原型的定义,实际上就是对原对象加入了一个给定名称的属性或者方法,而我们之所以把它单独拿出来,是避免反复生成同样的内容,效率上的问题,再有就是可能多个对象拥有共同的属性,这让我们想起了继承的定义,父类的存在不就是为此存在的么,可是有人给出了一个更好的称呼:克隆,它毕竟还不是继承,由于A的原型为B的同一时候,B的原型还能够同一时候是A,这在继承中是不存在的,所以被称作克隆
5、小细节
当方法中存在某一属性,而其原型方法中也存在此属性时,原对象的方法的优先级是要高于原型方法的。
稀稀拉拉写了不少,可是还感觉有些乱,感觉上隐约有些似懂非懂,用语言把它描绘清楚了有些难度当前来看,但这却是是当前的理解,希望随着经验的添加,理解不断加深吧....
js关于propotype的一些事-------Day62的更多相关文章
- 【js笔记】数组那些事[0]
js中数组是一个特殊的对象,索引是它的属性,整数索引在内部被转化为字符串类型. 1 数组的创建 new关键字方法:var arr=new Array() var arr=new Array(10); ...
- js中的奇闻异事
- JS魔法堂:深究JS异步编程模型
前言 上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...
- 深究JS异步编程模型
前言 上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...
- Ext JS 5 beta版发布
原文:Announcing Public Beta of Ext JS 5 我们非常高兴的宣布,Sencha Ext JS 5 beta版本开始进行公测了.这个beta版本可以让你.我们Sencha社 ...
- 基础篇:8.如何定义变量?js变量有什么特点?
书接上文,废话不多说,直接进入正题,下面我们一起来讨论js中的变量那些事! 那什么是变量? 变量是存储信息的容器,可以存储任何类型的数据. 如何定义变量呢? 变量可以使用短名称,如x,y:也可以是长名 ...
- node.js介绍和npm的使用
Node.js介绍 打开Nodejs英文网:https://nodejs.org/en/ 中文网:http://nodejs.cn/ 我们会发现这样一句话: 翻译成中文如下: Node.js 是一个基 ...
- js运行机制
情况一 script标签里面的运行顺序是同步的 遇到settimeout的时候就会变异步,最后执行 执行顺序为1342 情况二 只输出a 情况三 输出4444 异步队列插入的时间和执行时间 for循环 ...
- 配合sublime使用flexible.js实现微信开发页面自适应
什么是flexible.js 是一个终端设备适配的解决方案.也就是说它可以让你在不同的终端设备中实现页面适配. 是一个用来适配移动端的javascript框架.根据宽度的不同设置不同的字体大小,样式间 ...
随机推荐
- SQLSERVER图片查看工具SQL Image Viewer5.5.0.156
原文:SQLSERVER图片查看工具SQL Image Viewer5.5.0.156 SQLSERVER图片查看工具SQL Image Viewer5.5.0.156 在2013年某一次北京SQL ...
- 你怎么知道你的网站K
最近有朋友问我关于网站K问题,你怎么知道被提及哪些网站K方面.总结了六个方法后,,至于有没有其他办法.欢迎和我交流讨论. 检测方法是网站的搜索引擎惩罚: 首先要明白的是.搜索引擎不惩罚easy侦查 ...
- BrowserSync使用
在Gulp中使用BrowserSync 2016-02-24 23:47 by 那时候的我, 116 阅读, 0 评论, 收藏, 编辑 博客已迁移至http://lwzhang.github.io. ...
- Div 滚动栏滚动到指定的位置
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 【程序猿助手】Emacs,最强的编辑器,之间的不
wx_fmt=png" alt="" style="max-width:100%; height:auto!important"> 内容简单 ...
- Blend4精选案例图解教程(五):可视数据管理
原文:Blend4精选案例图解教程(五):可视数据管理 应用程序中我们会经常需要操作数据,在程序设计之初示例数据一般都是手工添加,Blend4提供了非常方便的数据管理能力,包括丰富的数据类型和内置示例 ...
- DOM操作应用
创建元素 document.createElement("li"); 添加节点 oUl.appendChild(oLi); 在某个元素之前插入一个节点 oUl.insertBefo ...
- Duanxx的STM32学习: 启动模式,BOOT0和BOOT1具体解释
在画STM32的电路图的时候,关于STM32的启动方式纠结了一下,现有的參考设计都是在STM32的启动选择引脚BOOT0和BOOT1上使用了跳帽,用以人工选择STM32的启动方式,可是在实际应用中这样 ...
- ODPS 下一个map / reduce 准备
阿里接到一个电话说练习和比赛智能二选一, 真的很伤心, 练习之前积极老龄化的权利. 要总结ODPS下一个 写map / reduce 并进行购买预测过程. 首先这里的hadoop输入输出都是表的形式, ...
- 我已提取并尝试使用启动脚本(./start navicat)来启动 Navicat Linux 版本号,但没有反应
具体的安装教程,參考这个navicat_for_mysql_10.0.11在linux下的安装,介绍的非常具体 參考这个 :我可否在 64-bit Linux 执行 Navicat? 推荐navica ...