- 浏览: 169940 次
- 性别:
- 来自: 天津
文章分类
最新评论
今天刚刚接触js中对象的prototype属性,google过程中看到这样一篇文章觉得以后也许会用着,转载保存一下,原文地址是http://bokee.shinylife.net/blog/article.asp?id=455&page=2#comm_top
2、已有方法的实现和增强,初识 prototype:
(1) Array.push(new_element)
作用:在数组末尾加入一个新的元素
实现方法:
Array.prototype.push = function(new_element){
this[this.length]=new_element;
return this.length;
}
让我们进一步来增强他,让他可以一次增加多个元素!
实现方法:
Array.prototype.pushPro = function() {
var currentLength = this.length;
for (var i = 0; i < arguments.length; i++) {
this[currentLength + i] = arguments[i];
}
return this.length;
}
应该不难看懂吧?以此类推,你可以考虑一下如何通过增强 Array.pop 来实现删除任意位置,任意多个元素(具体代码就不再细说了)
(2) String.length
作用:这实际上是 String 类的一个属性,但是由于 JavaScript 将全角、半角均视为是一个字符,在一些实际运用中可能会造成一定的问题,现在我们通过 prototype 来弥补这部不足。
实现方法:
String.prototype.cnLength = function(){
var arr=this.match(/[^\x00-\xff]/ig);
return this.length+(arr==null?0:arr.length);
}
试验:alert("EaseWe空间Spaces".cnLength()) -> 显示 16
这里用到了一些正则表达式的方法和全角字符的编码原理,由于属于另两个比较大的类别,本文不加说明,请参考相关材料。
3、新功能的实现,深入 prototype:在实际编程中所用到的肯定不只是已有方法的增强,更多的实行的功能的要求,下面我就举两个用 prototype 解决实际问题的例子:
(1) String.left()
问题:用过 vb 的应该都知道left函数,从字符串左边取 n 个字符,但是不足是将全角、半角均视为是一个字符,造成在中英文混排的版面中不能截取等长的字符串
作用:从字符串左边截取 n 个字符,并支持全角半角字符的区分
实现方法:
String.prototype.left = function(num,mode){
if(!/\d+/.test(num))return(this);
var str = this.substr(0,num);
if(!mode) return str;
var n = str.Tlength() - str.length;
num = num - parseInt(n/2);
return this.substr(0,num);
}
试验:
alert("EaseWe空间Spaces".left(8)) -> 显示 EaseWe空间
alert("EaseWe空间Spaces".left(8,true)) -> 显示 EaseWe空
本方法用到了上面所提到的String.Tlength()方法,自定义方法之间也能组合出一些不错的新方法呀!
(2) Date.DayDiff()
作用:计算出两个日期型变量的间隔时间(年、月、日、周)
实现方法:
Date.prototype.DayDiff = function(cDate,mode){
try{
cDate.getYear();
}catch(e){
return(0);
}
var base =60*60*24*1000;
var result = Math.abs(this - cDate);
switch(mode){
case "y":
result/=base*365;
break;
case "m":
result/=base*365/12;
break;
case "w":
result/=base*7;
break;
default:
result/=base;
break;
}
return(Math.floor(result));
}
试验:alert((new Date()).DayDiff((new Date(2002,0,1)))) -> 显示 329
alert((new Date()).DayDiff((new Date(2002,0,1)),"m")) -> 显示 10
当然,也可以进一步扩充,得出响应的小时、分钟,甚至是秒。
(3) Number.fact()
作用:某一数字的阶乘
实现方法:
Number.prototype.fact=function(){
var num = Math.floor(this);
if(num<0)return NaN;
if(num==0 || num==1)
return 1;
else
return (num*(num-1).fact());
}
试验:alert((4).fact()) -> 显示 24
这个方法主要是说明了递归的方法在 prototype 方法中也是可行的!
发表评论
-
ajax下载文档 ClientAbortException: java.net.SocketException: Connection reset by pee
2013-08-28 13:58 2294众所周知ajax是使用了浏览器内部的XmlHttpRequ ... -
在js里引用另一个js文件
2013-08-28 10:58 822new_element=document.createE ... -
<转> js替换字符正则表达式
2013-08-16 14:28 805function replace() { var str ... -
<转> JQuery选择器
2013-08-16 10:24 855<html> <head> &l ... -
jQuery获取Select选择的Text和 Value(转)
2013-08-13 09:47 580jQuery获取Select选择的Text和Valu ... -
<转>javascript获取地址栏参数
2013-08-12 10:03 703function GetQueryString(name){v ... -
iframe子页面内刷新同页面中另一个iframe
2013-08-09 15:25 10556框架页面如下: <div id="a ... -
jquery动态修改链接的onclick方法
2013-08-07 11:29 2326用jquery动态修改链接的onclick方法的传递参数,在 ... -
《转》JS怎么刷新当前页面
2013-04-15 13:17 843reload 方法,该方法强迫 ... -
<转>iframe去掉横向滚动条
2012-05-15 14:45 1240如题,就是在网页中, ... -
ie onmouseup和onclick事件执行顺序
2012-05-14 17:21 1158今天项目要做个类似网 ... -
iframe同步刷新时好时坏问题
2012-04-19 17:04 1235页面由左右两个iframe组成,要求右面内容更新时(内容跟左面 ... -
js浮动效果
2012-02-14 17:29 1014项目中某页面需要固定某个div内容,实际需求是这样的,有个评分 ... -
js判断页面关闭 仅支持IE6
2012-02-08 16:38 1654关闭页面时同时执行onbeforeunload和onunloa ... -
onpropertychange与输入法有关
2012-02-03 14:56 1196页面输入框经常有只允许输入数字的限制,一般都用onproper ... -
<转>name和function名字不能相同
2012-01-05 16:40 0今天突然碰到form表单的名字与js方法的名字相同导致找不到j ... -
onmousedown、onmouseup和onclick的奇怪问题
2011-07-08 10:04 2249将setTimeout的时间设置为0,告诉浏览器当它为当前任何 ... -
超链接<a>中属性href与target相冲突的地方
2011-03-25 11:47 1920今天在项目中写了两行代码,出现不同的效果: ①<a h ... -
<转>键盘回车事件导致页面刷新的问题
2011-03-24 11:18 873我最近在做一个 Ajax 查询的功能,代码如下: ... -
JS 字符串连接性能
2010-09-12 17:18 2164在W3SCHOOL中有讨论js字符串连接方法性能对比的篇章如下 ...
相关推荐
这个例子展示了如何使用`prototype`来实现方法的共享,避免了在每个实例中重复定义相同的方法,节省了内存。 接下来,`prototype`还涉及到原型链。当试图访问一个对象的属性时,JavaScript会首先检查该对象自身是否...
- **`Object.prototype.extend`**:该方法使得任何对象都可以直接使用 `extend` 方法来自身扩展其他对象的属性。这是一种链式调用的方式,使得代码更加灵活。 #### 6. Function.prototype.bind 方法 ```javascript...
### 开源JS包Prototype使用指南 #### 1.1 Prototype是什么? Prototype是一个由Sam Stephenson编写的JavaScript库,它提供了一套简洁、高效且易于使用的API来简化Web应用开发过程中的许多常见任务。该库专注于简化...
Prototype 是一个广泛使用的JavaScript库,由Sam Stephenson创建,旨在简化和增强JavaScript的原生功能,特别是对于构建富客户端Web应用程序。它通过提供强大的对象扩展、DOM操作、以及Ajax交互等工具,使得开发者...
《prototype.js 说明文档》是关于JavaScript库prototype.js的详细指南,主要涵盖了其核心概念、通用方法以及Ajax对象的使用等内容。Prototype是一个由Sam Stephenson编写的JavaScript库,旨在简化和增强JavaScript...
**原型模式(Prototype Pattern)**是一种创建型设计模式,它提供了一种通过复制已有对象来创建新对象的方式,而不是通过构造函数。在某些情况下,当创建新对象的成本非常高时(例如,对象需要大量的初始化操作或者从...
本文将深入探讨如何使用Prototype实现面向对象的方法,并通过实例来解释其工作原理。 1. Prototype 概念: Prototype是JavaScript中的一个重要概念,它是一个内置属性,存在于所有函数(Function对象)中。当创建...
同时,这个中文手册对于初学者来说尤其有用,因为它可以帮助克服语言障碍,使非英语背景的开发者也能轻松掌握Prototype的用法。 总的来说,Prototype是一个强大的JavaScript库,它简化了DOM操作,增强了AJAX功能,...
在实际编程中,Prototype模式可以与其他设计模式结合使用,例如工厂方法模式,通过工厂方法来返回克隆后的对象,增加代码的可扩展性和灵活性。 总结一下,Prototype模式是一种有效的创建型设计模式,通过对象的克隆...
尽管在现代前端框架如React、Vue和Angular盛行的今天,Prototype的使用频率有所下降,但它在JavaScript社区中的地位仍然不可忽视,尤其对于理解面向对象编程和DOM操作有着重要的学习价值。了解Prototype可以帮助...
此外,还可以结合使用`Blob`或`ArrayBuffer`对象来处理二进制数据,这在处理如图片、音频等大型文件时尤其有用。在发送前,需要将大数据转换为这些格式,然后通过`send`方法发送。 标签中的“源码”可能意味着你...
Prototype-v1.6.0包含了JSON(JavaScript Object Notation)的支持,可以方便地进行JSON数据的解析和字符串化,这对于与服务器交换数据非常有用。 **7. 兼容性与性能优化** Prototype-v1.6.0考虑了浏览器的兼容性,...
此外,还有对`Ajax.Request`、`Ajax.Updater`和`Ajax.PeriodicalUpdater`等类的使用说明,它们在实现页面局部更新和定时刷新时十分有用。 Prototype还包含一系列实用的辅助函数,如数组操作、字符串处理、函数操作...
此外,Prototype 源码中还有很多其他有用的功能,如 `Function.prototype.bind`(绑定函数上下文),`Array.prototype.each`(数组迭代),以及 `Element` 和 `Event` 的扩展等,这些都是为了增强 JavaScript 的基本...
Prototype 是一个著名的JavaScript库,它的1.4.0版本在Web开发领域有着广泛的使用。这个库为JavaScript程序员提供了许多实用的功能,包括对象扩展、类创建、DOM操作等,极大地提升了开发效率。接下来,我们将深入...
2. **使用虚构造函数**:虽然C++不直接支持虚构造函数,但可以使用工厂方法或者`clone()`函数模拟这一行为。 3. **模板方法**:如果多个类具有相同的克隆逻辑,可以使用模板类来实现,这样可以减少代码重复。 ...
当我们通过`new`关键字创建一个对象时,这个对象会自动获取构造函数`prototype`上的属性和方法。例如: ```javascript Person.prototype.name = "John"; person.name; // 输出 "John" ``` `name`属性被添加到`...
尽管Prototype在JavaScript社区中曾广受欢迎,但随着ES6的发布和jQuery等其他库的崛起,Prototype的使用逐渐减少。然而,理解其设计理念和用法对于深入理解JavaScript的原型机制和面向对象编程仍然具有一定的价值。...
在这里,`Ajax.Request`函数接受目标URL、请求方法、参数以及回调函数作为参数。当请求成功时,`onSuccess`回调函数将被调用,可以在此处理服务器返回的数据;而`onFailure`则在请求失败时执行。 通过以上解析,...
阅读《Prototype 1.6.0.3 中文参考手册》并结合`Prototype.chm`,将有助于读者全面掌握Prototype库的使用,从而在JavaScript开发中更加游刃有余,特别是在处理动态网页和Ajax应用时。最后,`readme.txt`文件通常包含...