当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Prototype ObjectRange对象学习

Javascript
JQuery 获取和设置Select选项的代码
jQuery ctrl+Enter shift+Enter实现代码
jQuery学习2 选择器的使用说明
jQuery学习3:操作元素属性和特性
jQuery学习4 浏览器的事件模型
jQuery学习5 jQuery事件模型
jQuery 学习6 操纵元素显示效果的函数
jQuery学习7 操作JavaScript对象和集合的函数
jQuery库与其他JS库冲突的解决办法
JavaScript Event事件学习第一章 Event介绍
JavaScript Event学习第二章 Event浏览器兼容性
JavaScript Event学习第三章 早期的事件处理程序
JavaScript Event学习第四章 传统的事件注册模型
JavaScript Event学习第五章 高级事件注册模型
JavaScript Event学习第六章 事件的访问
JavaScript Event学习第七章 事件属性
JavaScript Event学习第八章 事件的顺序
js png图片(有含有透明)在IE6中为什么不透明了
JavaScript 读取元素的CSS信息的代码
基于mootools的圆角边框扩展代码

Javascript 中的 Prototype ObjectRange对象学习


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 134 ::
收藏到网摘: n/a

ObjectRange对象基本就是实现了连续的数字或者字符串,其中只包含一个方法,include,判断某个数字或者字符串是否在ObjectRange里。并且ObjectRange对象还混入了Enumerable的方法,所以可以直接在ObjectRange对象上调用Enumerable对象里面的方法。 Ranges represent an interval of values. The value type just needs to be “compatible,” that is, to implement a succ method letting us step from one value to the next (its successor).
Prototype provides such a method for Number and String, but you are of course welcome to implement useful semantics in your own objects, in order to enable ranges based on them.
ObjectRange对象基本就是实现了连续的数字或者字符串,其中只包含一个方法,include,判断某个数字或者字符串是否在ObjectRange里。并且ObjectRange对象还混入了Enumerable的方法,所以可以直接在ObjectRange对象上调用Enumerable对象里面的方法。
复制代码 代码如下:

//创建ObjectRange的便捷方法
function $R(start, end, exclusive) {
return new ObjectRange(start, end, exclusive);
}
//创建ObjectRange对象并且继承自Enumerable
var ObjectRange = Class.create(Enumerable, (function() {
//初始化方法,exclusive为true时,不包含end数值,默认为undefined也就相当于false
function initialize(start, end, exclusive) {
this.start = start;
this.end = end;
this.exclusive = exclusive;
}
//覆盖Enumerable里面的_each方法,在遍历ObjectRange对象时需要用到此方法
function _each(iterator) {
var value = this.start;
while (this.include(value)) {
iterator(value);
value = value.succ();
}
}
//判断某个数值或者字符串是否包含在ObjectRange对象里
function include(value) {
if (value < this.start)
return false;
if (this.exclusive)
return value < this.end;
return value <= this.end;
}
return {
initialize: initialize,
_each: _each,
include: include
};
})());

看一下示例,然后在详细解释一些细节:
复制代码 代码如下:

$A($R('a', 'e'))
// -> ['a', 'b', 'c', 'd', 'e'], no surprise there
//千万不要尝试输出下面返回的结果,否者将会造成浏览器直接死掉
$A($R('ax', 'ba'))
// -> Ouch! Humongous array, starting as ['ax', 'ay', 'az', 'a{', 'a|', 'a}', 'a~'...]

这里说一下$A($R('a', 'e')),如何返回值。首先看$A方法,前面的文章【Prototype 学习——工具函数学习($A方法)】中已经详细讲解了$A方法,不知道请自行参考。在$A方法里面有这样一句:if ('toArray' in Object(iterable)) return iterable.toArray();我们知道,ObjectRange里面混入了Enumerable里面的方法,也就是说间接实现了toArray方法,那么看一下Enumerable里面的toArray方法:
复制代码 代码如下:

function toArray() {
return this.map();
}
//======> this.map()
//我们注意到在返回的时候map方法被映射到了collect方法
return {
//...
collect: collect,
map: collect,
//...
}
//======> collect()
//在本例中这个方法其实就相当于返回一个数组,因为传进来的参数都是undefined。这里面有一个this.each方法,继续查看
function collect(iterator, context) {
iterator = iterator || Prototype.K;
var results = [];
this.each(function(value, index) {
results.push(iterator.call(context, value, index));
});
return results;
}
//======> this.each()
//终于看到this._each了,现在明白为什么ObjectRange里面会重写了_each方法了吧。在遍历的时候要用到这个方法
function each(iterator, context) {
var index = 0;
try {
this._each(function(value) {
iterator.call(context, value, index++);
});
} catch (e) {
if (e != $break) throw e;
}
return this;
}
//======> this._each()
//详细说明一下this._each()
//关键就是succ()这个方法,因为_each里面使用这个方法产生下一个数值。
//这个succ()在哪里呢?在Number.prototype和String.prototype里面定义了这个方法
function _each(iterator) {
var value = this.start;
while (this.include(value)) {
iterator(value);
value = value.succ();
}
}
//下面两个方法我就不讲了吧。
//======> String.prototype.succ()
function succ() {
return this.slice(0, this.length - 1) +
String.fromCharCode(this.charCodeAt(this.length - 1) + 1);
}
//======> Number.prototype.succ()
function succ() {
return this + 1;
}
//综上所述,如果你自己想定义其它类型的ObjectRange对象,譬如Date类型,那么你就要自己实现succ()方法,用来生成连续的对象

上面的流程将清楚了,但一些函数没有仔细讲,等讲到这些对象的时候在仔细说明里面的函数。下面看几个include的示例吧:
复制代码 代码如下:

$R(1, 10).include(5)
// -> true
$R('a', 'h').include('x')
// -> false
$R(1, 10).include(10)
// -> true
$R(1, 10, true).include(10)
// -> false