近期在忙着搬家,忙忙活活的收拾这收拾那,原以为自己东西了了,谁知道东西是越收拾越多,各种崩溃啊.....

昨日在记录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的更多相关文章

  1. 【js笔记】数组那些事[0]

    js中数组是一个特殊的对象,索引是它的属性,整数索引在内部被转化为字符串类型. 1 数组的创建 new关键字方法:var arr=new Array() var arr=new Array(10); ...

  2. js中的奇闻异事

  3. JS魔法堂:深究JS异步编程模型

    前言  上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...

  4. 深究JS异步编程模型

    前言  上周5在公司作了关于JS异步编程模型的技术分享,可能是内容太干的缘故吧,最后从大家的表情看出"这条粉肠到底在说啥?"的结果:(下面是PPT的讲义,具体的PPT和示例代码在h ...

  5. Ext JS 5 beta版发布

    原文:Announcing Public Beta of Ext JS 5 我们非常高兴的宣布,Sencha Ext JS 5 beta版本开始进行公测了.这个beta版本可以让你.我们Sencha社 ...

  6. 基础篇:8.如何定义变量?js变量有什么特点?

    书接上文,废话不多说,直接进入正题,下面我们一起来讨论js中的变量那些事! 那什么是变量? 变量是存储信息的容器,可以存储任何类型的数据. 如何定义变量呢? 变量可以使用短名称,如x,y:也可以是长名 ...

  7. node.js介绍和npm的使用

    Node.js介绍 打开Nodejs英文网:https://nodejs.org/en/ 中文网:http://nodejs.cn/ 我们会发现这样一句话: 翻译成中文如下: Node.js 是一个基 ...

  8. js运行机制

    情况一 script标签里面的运行顺序是同步的 遇到settimeout的时候就会变异步,最后执行 执行顺序为1342 情况二 只输出a 情况三 输出4444 异步队列插入的时间和执行时间 for循环 ...

  9. 配合sublime使用flexible.js实现微信开发页面自适应

    什么是flexible.js 是一个终端设备适配的解决方案.也就是说它可以让你在不同的终端设备中实现页面适配. 是一个用来适配移动端的javascript框架.根据宽度的不同设置不同的字体大小,样式间 ...

随机推荐

  1. 转载:PHP时间戳 strtotime()使用方法和技巧

    在php中我想要获取时间戳有多种方法,最常用的就是使用time函数与strtotime()函数把日期转换成时间戳了 获取指定的年月日转化为时间戳:pHP时间戳函数获取指定日期的unix时间戳 strt ...

  2. freemarker 里 ?? 和 ? 都是什么意思

    ??是推断对象是否为空,比如:<#if object??>object对象不为空(即object存在)</#if> ?后面要加keyword,比如:<#if object ...

  3. 发现C++Builder 2010一组类BUG

        今天C++Builder 2010写小码,我们用一个集合类.您可以设置操作结果是不正确的,排除其他原因引起的,最后,它应该被设置以确定问题类的源,以下是一个集合类测试代码: enum TTes ...

  4. Eclipse 在线安装fat jar插件

    在线安装步骤: eclipse菜单栏 help >software updates >Search for new features to install>new update si ...

  5. Android自己定义组件系列【5】——高级实践(1)

    在接下来的几篇文章将任老师的博文<您可以下拉PinnedHeaderExpandableListView实现>骤来具体实现.来学习一下大神的代码并记录一下. 原文出处:http://blo ...

  6. 使用 Cordova+Visual Studio 创建跨平台移动应用(2)

    目前开发移动应用有三种模式:Native.Hybird.Web,若要开发跨平台的移动应用,又希望与本地API交互,那么Hybird是一个非常好的选择.       作为一个.Net程序员,可以使用熟悉 ...

  7. Java 对象的生命周期

    Java对象的生命周期 在Java中,对象的生命周期包含下面几个阶段: 1.      创建阶段(Created) 2.      应用阶段(In Use) 3.      不可见阶段(Invisib ...

  8. SSh框架结构(Struts2.1+Hibernate4.0+Spring3.1)

    一个.使用的工具 开发工具:My Eclipse 10.7以及对应的java开发工具 框架版本号:Struts2.1+Hibernate3+Spring3.0 数据库:MySql5.5 Mysql可视 ...

  9. 流动python - 什么是魔术方法(magic method)

    我们经常看到各种各样的方法已经被包围了由双下划线,例如__init__,他们是魔术方法. 魔术方法python语言预订好"协议",在不同情况下不同的魔术方法,是隐式调用.我们重写这 ...

  10. 最简单的视音频播放演示样例8:DirectSound播放PCM

    ===================================================== 最简单的视音频播放演示样例系列文章列表: 最简单的视音频播放演示样例1:总述 最简单的视音频 ...