繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Prototype Enumerable对象 学习
- Javascript
- 动态生成select选项全接触
- 不刷新页面动态更新select选项，实现两个select相互操作
- 网页输入框日期型有效性判定一网打尽
- 实用Javascript函数之一(自动将输入文本框中的内容转换成大写字符)
- 实用Javascript函数之二(自动将输入文本框中的内容转换成小写字符)
- 实用Javascript函数之三(限制文本输入框中只能输入数字\"0\"到\"9\")
- 实用Javascript函数之四(用于对sString字符串进行前空格截除)
- 实用Javascript函数之五(用于对sString字符串进行后空格截除)
- 实用Javascript函数之六(截除字符串前后空格)
- 如何使用交替的滚动标题
- 采用DOM模型时创建一个Select节点后，要删除option项的解决方法
- javascript函数速查
- 利用JavaScript和正则表达式进行丰富的日期判断（给其它项目组的代码，有比较好的编程风格和注释）
- 关于字符串的几个有用函数
- FileSystemObject 的例子（处理驱动器、文件夹、文件）
- 用JScript实现VB.Net,C#的[委托Delegate]:
- 得到固定字符位置的函数
- IE NC通用的藏鼠标右键一法
- Menu
- foolpot2001菜单
Javascript 中的 Prototype Enumerable对象 学习
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 99 ::
收藏到网摘: n/a
Enumerable是Prototype框架的基石，而Enumerable不单独使用，在Prototype中其它对象mix了Enumerable里面的方法，这样就可以在这些对象上应用Enumerable的方法，这样的对象有：Array，Hash，ObjectRange，还有一些和DOM，AJAX相关的对象。
Enumerable provides a large set of useful methods for enumerations, that is, objects that act as collections of values. It is a cornerstone of Prototype.
Enumerable is what we like to call a module: a consistent set of methods intended not for independent use, but for mixin: incorporation into other objects that “fit” with it.
Quite a few objects, in Prototype, mix Enumerable in already. The most visible cases are Array and Hash, but you'll find it in less obvious spots as well, such as in ObjectRange and various DOM- or AJAX-related objects.
上面这短话的意思大概就是说Enumerable是Prototype框架的基石，而Enumerable不单独使用，在Prototype中其它对象mix了Enumerable里面的方法，这样就可以在这些对象上应用Enumerable的方法，这样的对象有：Array，Hash，ObjectRange，还有一些和DOM，AJAX相关的对象。
个人理解Enumerable相当于C++中的抽象类的概念，其它类可以继承自这个类，并且实现Enumerable里面的抽象方法"_each"，并且可以覆盖其它的方法，而Enumerable本身却不可以实例化，只可以实例化它的子类。
下面看一下如何通过Enumerable来写自己的类：
复制代码 代码如下:
any方法：
跟all方法差不多，就不详细说了，看一下示例
[].any()
// -> false (empty arrays have no elements that could be true-equivalent)
$R(0, 2).any()
// -> true (on the second loop cycle, 1 is true-equivalent)
[2, 4, 6, 8, 10].any(function(n) { return 0 == n % 3; })
// -> true (the iterator will return true on 6: the array does have 1+ multiple of 3)
$H({ opt1: null, opt2: false, opt3: '', opt4: 'pfew!' }).any(function(pair) { return pair.value; })
// -> true (thanks to the opt4/'pfew!' pair, whose value is true-equivalent)
collect/map（collect方法别名）方法：
['Hitch', "Hiker's", 'Guide', 'To', 'The', 'Galaxy'].collect(function(s) { return s.charAt(0).toUpperCase(); }).join('')
// -> 'HHGTTG'
$R(1,5).collect(function(n) { return n * n; })
// -> [1, 4, 9, 16, 25]
注意帮助文档上最后有这样几行提示：
First, the method-calling scenario: you want to invoke the same method on all elements, possibly with arguments, and use the result values. This can be achieved easily with invoke.
Second, the property-fetching scenario: you want to fetch the same property on all elements, and use those. This is a breeze with pluck.
detect方法：
找到第一个满足某个条件的数据，并返回，看一下示例，其实这个方法就是find的别名，所以调用detect和find是一样的：
// An optimal exact prime detection method, slightly compacted.
function isPrime(n) {
if (2 > n) return false;
if (0 == n % 2) return (2 == n);
for (var index = 3; n / index > index; index += 2)
if (0 == n % index) return false;
return true;
}
// isPrime
$R(10,15).find(isPrime) // -> 11
[ 'hello', 'world', 'this', 'is', 'nice'].find(function(s) { return s.length <= 3; })
// -> 'is'
['one', 'two', 'three'].each(function(s) { alert(s); });
[ 'hello', 'world'].each(function(s, index) { alert(index + ': ' + s); });
// alerts -> '0: hello' then '1: world'
// This could be done better with an accumulator using inject, but humor me
// here...
var result = [];
$R(1,10).each(function(n) {
if (0 == n % 2) throw $continue;
if (n > 6) throw $break;
result.push(n);
});
// result -> [1, 3, 5]
var students = [ { name: 'Sunny', age: 20 }, { name: 'Audrey', age: 21 }, { name: 'Matt', age: 20 }, { name: 'Élodie', age: 26 }, { name: 'Will', age: 21 }, { name: 'David', age: 23 }, { name: 'Julien', age: 22 }, { name: 'Thomas', age: 21 }, { name: 'Serpil', age: 22 } ];
students.eachSlice(4, function(toon) { return toon.pluck('name'); })
// -> [ ['Sunny', 'Audrey', 'Matt', 'Élodie'],
// ['Will', 'David', 'Julien', 'Thomas'],
// ['Serpil'] ]
//下面的first方法是Array对象提供的
students.eachSlice(2).first()
// -> [{ name: 'Sunny', age: 20 }, { name: 'Audrey', age: 21 }]
entries方法，就是toArray方法，toArray方法里面又调用map方法，map方法就相当于collect方法：
$R(1, 5).toArray() // -> [1, 2, 3, 4, 5]
find/findAll（select方法的别名）方法：
//find方法
[ 'hello', 'world', 'this', 'is', 'nice'].find(function(s) { return s.length <= 3; })
// -> 'is'
//findAll方法
$R(1, 10).findAll(function(n) { return 0 == n % 2; })
// -> [2, 4, 6, 8, 10] [ 'hello', 'world', 'this', 'is', 'nice'].findAll(function(s) { return s.length >= 5; })
// -> ['hello', 'world']
grep方法：
这个方法需要注意的就是，参数filter在函数里面是要被统一成正则表达式的，然后调用正则表达式的match方法来进行判断
// Get all strings with a repeated letter somewhere
['hello', 'world', 'this', 'is', 'cool'].grep(/(.)\1/)
// -> ['hello', 'cool']
// Get all numbers ending with 0 or 5
$R(1,30).grep(/[05]$/)
// -> [5, 10, 15, 20, 25, 30]
// Those, minus 1
$R(1,30).grep(/[05]$/, function(n) { return n - 1; })
// -> [4, 9, 14, 19, 24, 29]
// Get all strings with a repeated letter somewhere
['hello', 'world', 'this', 'is', 'cool'].grep(/(.)\1/)
// -> ['hello', 'cool']
// Get all numbers ending with 0 or 5
$R(1,30).grep(/[05]$/)
// -> [5, 10, 15, 20, 25, 30]
// Those, minus 1
$R(1,30).grep(/[05]$/, function(n) { return n - 1; })
// -> [4, 9, 14, 19, 24, 29]
inGroupsOf方法：
var students = [ { name: 'Sunny', age: 20 }, { name: 'Audrey', age: 21 }, { name: 'Matt', age: 20 }, { name: 'Élodie', age: 26 }, { name: 'Will', age: 21 }, { name: 'David', age: 23 }, { name: 'Julien', age: 22 }, { name: 'Thomas', age: 21 }, { name: 'Serpil', age: 22 } ];
//pluck方法就是取得对象的某个属性，这里取得的是name属性
students.pluck('name').inGroupsOf(4)
// -> [ ['Sunny', 'Audrey', 'Matt', 'Élodie'],
// ['Will', 'David', 'Julien', 'Thomas'],
// ['Serpil', null, null, null] ]
include/member（include方法的别名）方法，这里先检查了一下对象上是否有indexOf方法，如果有的话则直接调用这个方法：
$R(1,15).include(10)
// -> true
['hello', 'world'].include('HELLO')
// -> false
[1, 2, '3', '4', '5'].include(3)
// -> true (== ignores actual type)
inject方法：
$R(1,10).inject(0, function(acc, n) { return acc + n; })
// -> 55 (sum of 1 to 10)
$R(2,5).inject(1, function(acc, n) { return acc * n; })
// -> 120 (factorial 5)
['hello', 'world', 'this', 'is', 'nice'].inject([], function(array, value, index) {
if (0 == index % 2) array.push(value);
return array;
})
// -> ['hello', 'this', 'nice']
invoke方法：
['hello', 'world', 'cool!'].invoke('toUpperCase')
// ['HELLO', 'WORLD', 'COOL!']
['hello', 'world', 'cool!'].invoke('substring', 0, 3)
// ['hel', 'wor', 'coo']
max/min方法：
$R(1,10).max() // -> 10
['hello', 'world', 'gizmo'].max()
// -> 'world'
function Person(name, age) { this.name = name; this.age = age; }
var john = new Person('John', 20);
var mark = new Person('Mark', 35);
var daisy = new Person('Daisy', 22);
[john, mark, daisy].max(function(person) { return person.age; })
// -> 35
partition方法：
['hello', null, 42, false, true, , 17].partition()
// -> [['hello', 42, true, 17], [null, false, undefined]]
$R(1, 10).partition(function(n) { return 0 == n % 2; })
// -> [[2, 4, 6, 8, 10], [1, 3, 5, 7, 9]]
['hello', null, 42, false, true, , 17].partition()
// -> [['hello', 42, true, 17], [null, false, undefined]]
$R(1, 10).partition(function(n) { return 0 == n % 2; })
// -> [[2, 4, 6, 8, 10], [1, 3, 5, 7, 9]]
pluck方法：
['hello', 'world', 'this', 'is', 'nice'].pluck('length')
// -> [5, 5, 4, 3, 4]
reject方法：
$R(1, 10).reject(function(n) { return 0 == n % 2; })
// -> [1, 3, 5, 7, 9]
[ 'hello', 'world', 'this', 'is', 'nice'].reject(function(s) { return s.length >= 5; })
// -> ['this', 'is', 'nice']
$R(1, 10).reject(function(n) { return 0 == n % 2; })
// -> [1, 3, 5, 7, 9]
[ 'hello', 'world', 'this', 'is', 'nice'].reject(function(s) { return s.length >= 5; })
// -> ['this', 'is', 'nice']
size方法省略。
sortBy方法：
这个方法首先通过map方法返回一个对象数组，然后调用数组的sort方法，最后在取出对象中的value属性
['hello', 'world', 'this', 'is', 'nice'].sortBy(function(s) { return s.length; })
// -> 'is', 'this', 'nice', 'hello', 'world']
['hello', 'world', 'this', 'is', 'cool'].sortBy(function(s) {
var md = s.match(/[aeiouy]/g);
return null == md ? 0 : md.length;
})
// -> [ 'world', 'this', 'is', 'hello', 'cool'] (sorted by vowel count)
zip方法：
var firstNames = ['Justin', 'Mislav', 'Tobie', 'Christophe'];
var lastNames = ['Palmer', 'Marohnić', 'Langel', 'Porteneuve'];
firstNames.zip(lastNames)
// -> [['Justin', 'Palmer'], ['Mislav', 'Marohnić'], ['Tobie', 'Langel'], ['Christophe', 'Porteneuve']]
//通过这个例子我们可以看出参数a就是一个数组，表示两个数组中的相对应的项
firstNames.zip(lastNames, function(a) { return a.join(' '); })
// -> ['Justin Palmer', 'Mislav Marohnić', 'Tobie Langel', 'Christophe Porteneuve']
//通过这个例子我们可以看到传入的可以是多个数组
var cities = ['Memphis', 'Zagreb', 'Montreal', 'Paris'];
firstNames.zip(lastNames, cities, function(p) { return p[0] + ' ' + p[1] + ', ' + p[2]; })
// -> ['Justin Palmer, Memphis', 'Mislav Marohnić, Zagreb', 'Tobie Langel, Montreal', 'Christophe Porteneuve, Paris']
firstNames.zip($R(1, 100), function(a) { return a.reverse().join('. '); })
// -> ['1. Justin', '2. Mislav', '3. Tobie', '4. Christophe']
any方法：
跟all方法差不多，就不详细说了，看一下示例
复制代码 代码如下:
[].any()
// -> false (empty arrays have no elements that could be true-equivalent)
$R(0, 2).any()
// -> true (on the second loop cycle, 1 is true-equivalent)
[2, 4, 6, 8, 10].any(function(n) { return 0 == n % 3; })
// -> true (the iterator will return true on 6: the array does have 1+ multiple of 3)
$H({ opt1: null, opt2: false, opt3: '', opt4: 'pfew!' }).any(function(pair) { return pair.value; })
// -> true (thanks to the opt4/'pfew!' pair, whose value is true-equivalent)
collect/map（collect方法别名）方法：
Returns the results of applying the iterator to each element. Aliased as map.
This is a sort of Swiss-Army knife for sequences. You can turn the original values into virtually anything!
这个方法被称为”瑞士军刀“，这个方法基本上可以对数据进行任何操作，其中map方法是这个方法的别名，这个方法实现很简单，results.push(iterator.call(context, value, index));这句话是关键，就是对每个数据进行iterator调用，并且把结果存储到要返回的数组中，看一下示例：
复制代码 代码如下:
['Hitch', "Hiker's", 'Guide', 'To', 'The', 'Galaxy'].collect(function(s) { return s.charAt(0).toUpperCase(); }).join('')
// -> 'HHGTTG'
$R(1,5).collect(function(n) { return n * n; })
// -> [1, 4, 9, 16, 25]
注意帮助文档上最后有这样几行提示：
First, the method-calling scenario: you want to invoke the same method on all elements, possibly with arguments, and use the result values. This can be achieved easily with invoke.
Second, the property-fetching scenario: you want to fetch the same property on all elements, and use those. This is a breeze with pluck.
detect方法：
找到第一个满足某个条件的数据，并返回，看一下示例，其实这个方法就是find的别名，所以调用detect和find是一样的：
复制代码 代码如下:
// An optimal exact prime detection method, slightly compacted.
function isPrime(n) {
if (2 > n) return false;
if (0 == n % 2) return (2 == n);
for (var index = 3; n / index > index; index += 2)
if (0 == n % index) return false;
return true;
}
// isPrime
$R(10,15).find(isPrime) // -> 11
[ 'hello', 'world', 'this', 'is', 'nice'].find(function(s) { return s.length <= 3; })
// -> 'is'
each方法：
调用这个方法时，其实就是对每个数据进行iterator操作，传入iterator函数的第一个参数为数据，第二个参数为索引，在遍历过程中可以抛出$continue和$break异常，注意：
The usage of $continue is deprecated. This feature will not be available in releases after Prototype 1.5 in favor of speed.
看一下示例：
复制代码 代码如下:
['one', 'two', 'three'].each(function(s) { alert(s); });
[ 'hello', 'world'].each(function(s, index) { alert(index + ': ' + s); });
// alerts -> '0: hello' then '1: world'
// This could be done better with an accumulator using inject, but humor me
// here...
var result = [];
$R(1,10).each(function(n) {
if (0 == n % 2) throw $continue;
if (n > 6) throw $break;
result.push(n);
});
// result -> [1, 3, 5]
eachSlice方法：
下面很多简单的方法就直接给出示例了，不在解释了，算法也没有什么难得，基本一看就懂：
复制代码 代码如下:
var students = [ { name: 'Sunny', age: 20 }, { name: 'Audrey', age: 21 }, { name: 'Matt', age: 20 }, { name: 'Élodie', age: 26 }, { name: 'Will', age: 21 }, { name: 'David', age: 23 }, { name: 'Julien', age: 22 }, { name: 'Thomas', age: 21 }, { name: 'Serpil', age: 22 } ];
students.eachSlice(4, function(toon) { return toon.pluck('name'); })
// -> [ ['Sunny', 'Audrey', 'Matt', 'Élodie'],
// ['Will', 'David', 'Julien', 'Thomas'],
// ['Serpil'] ]
//下面的first方法是Array对象提供的
students.eachSlice(2).first()
// -> [{ name: 'Sunny', age: 20 }, { name: 'Audrey', age: 21 }]
entries方法，就是toArray方法，toArray方法里面又调用map方法，map方法就相当于collect方法：
复制代码 代码如下:
$R(1, 5).toArray() // -> [1, 2, 3, 4, 5]
find/findAll（select方法的别名）方法：
复制代码 代码如下:
//find方法
[ 'hello', 'world', 'this', 'is', 'nice'].find(function(s) { return s.length <= 3; })
// -> 'is'
//findAll方法
$R(1, 10).findAll(function(n) { return 0 == n % 2; })
// -> [2, 4, 6, 8, 10] [ 'hello', 'world', 'this', 'is', 'nice'].findAll(function(s) { return s.length >= 5; })
// -> ['hello', 'world']
grep方法：
这个方法需要注意的就是，参数filter在函数里面是要被统一成正则表达式的，然后调用正则表达式的match方法来进行判断
复制代码 代码如下:
// Get all strings with a repeated letter somewhere
['hello', 'world', 'this', 'is', 'cool'].grep(/(.)\1/)
// -> ['hello', 'cool']
// Get all numbers ending with 0 or 5
$R(1,30).grep(/[05]$/)
// -> [5, 10, 15, 20, 25, 30]
// Those, minus 1
$R(1,30).grep(/[05]$/, function(n) { return n - 1; })
// -> [4, 9, 14, 19, 24, 29]
// Get all strings with a repeated letter somewhere
['hello', 'world', 'this', 'is', 'cool'].grep(/(.)\1/)
// -> ['hello', 'cool']
// Get all numbers ending with 0 or 5
$R(1,30).grep(/[05]$/)
// -> [5, 10, 15, 20, 25, 30]
// Those, minus 1
$R(1,30).grep(/[05]$/, function(n) { return n - 1; })
// -> [4, 9, 14, 19, 24, 29]
inGroupsOf方法：
复制代码 代码如下:
var students = [ { name: 'Sunny', age: 20 }, { name: 'Audrey', age: 21 }, { name: 'Matt', age: 20 }, { name: 'Élodie', age: 26 }, { name: 'Will', age: 21 }, { name: 'David', age: 23 }, { name: 'Julien', age: 22 }, { name: 'Thomas', age: 21 }, { name: 'Serpil', age: 22 } ];
//pluck方法就是取得对象的某个属性，这里取得的是name属性
students.pluck('name').inGroupsOf(4)
// -> [ ['Sunny', 'Audrey', 'Matt', 'Élodie'],
// ['Will', 'David', 'Julien', 'Thomas'],
// ['Serpil', null, null, null] ]
include/member（include方法的别名）方法，这里先检查了一下对象上是否有indexOf方法，如果有的话则直接调用这个方法：
复制代码 代码如下:
$R(1,15).include(10)
// -> true
['hello', 'world'].include('HELLO')
// -> false
[1, 2, '3', '4', '5'].include(3)
// -> true (== ignores actual type)
inject方法：
复制代码 代码如下:
$R(1,10).inject(0, function(acc, n) { return acc + n; })
// -> 55 (sum of 1 to 10)
$R(2,5).inject(1, function(acc, n) { return acc * n; })
// -> 120 (factorial 5)
['hello', 'world', 'this', 'is', 'nice'].inject([], function(array, value, index) {
if (0 == index % 2) array.push(value);
return array;
})
// -> ['hello', 'this', 'nice']
invoke方法：
复制代码 代码如下:
['hello', 'world', 'cool!'].invoke('toUpperCase')
// ['HELLO', 'WORLD', 'COOL!']
['hello', 'world', 'cool!'].invoke('substring', 0, 3)
// ['hel', 'wor', 'coo']
max/min方法：
复制代码 代码如下:
$R(1,10).max() // -> 10
['hello', 'world', 'gizmo'].max()
// -> 'world'
function Person(name, age) { this.name = name; this.age = age; }
var john = new Person('John', 20);
var mark = new Person('Mark', 35);
var daisy = new Person('Daisy', 22);
[john, mark, daisy].max(function(person) { return person.age; })
// -> 35
partition方法：
复制代码 代码如下:
['hello', null, 42, false, true, , 17].partition()
// -> [['hello', 42, true, 17], [null, false, undefined]]
$R(1, 10).partition(function(n) { return 0 == n % 2; })
// -> [[2, 4, 6, 8, 10], [1, 3, 5, 7, 9]]
['hello', null, 42, false, true, , 17].partition()
// -> [['hello', 42, true, 17], [null, false, undefined]]
$R(1, 10).partition(function(n) { return 0 == n % 2; })
// -> [[2, 4, 6, 8, 10], [1, 3, 5, 7, 9]]
pluck方法：
复制代码 代码如下:
['hello', 'world', 'this', 'is', 'nice'].pluck('length')
// -> [5, 5, 4, 3, 4]
reject方法：
复制代码 代码如下:
$R(1, 10).reject(function(n) { return 0 == n % 2; })
// -> [1, 3, 5, 7, 9]
[ 'hello', 'world', 'this', 'is', 'nice'].reject(function(s) { return s.length >= 5; })
// -> ['this', 'is', 'nice']
$R(1, 10).reject(function(n) { return 0 == n % 2; })
// -> [1, 3, 5, 7, 9]
[ 'hello', 'world', 'this', 'is', 'nice'].reject(function(s) { return s.length >= 5; })
// -> ['this', 'is', 'nice']
size方法省略。
sortBy方法：
这个方法首先通过map方法返回一个对象数组，然后调用数组的sort方法，最后在取出对象中的value属性
复制代码 代码如下:
['hello', 'world', 'this', 'is', 'nice'].sortBy(function(s) { return s.length; })
// -> 'is', 'this', 'nice', 'hello', 'world']
['hello', 'world', 'this', 'is', 'cool'].sortBy(function(s) {
var md = s.match(/[aeiouy]/g);
return null == md ? 0 : md.length;
})
// -> [ 'world', 'this', 'is', 'hello', 'cool'] (sorted by vowel count)
zip方法：
复制代码 代码如下:
var firstNames = ['Justin', 'Mislav', 'Tobie', 'Christophe'];
var lastNames = ['Palmer', 'Marohnić', 'Langel', 'Porteneuve'];
firstNames.zip(lastNames)
// -> [['Justin', 'Palmer'], ['Mislav', 'Marohnić'], ['Tobie', 'Langel'], ['Christophe', 'Porteneuve']]
//通过这个例子我们可以看出参数a就是一个数组，表示两个数组中的相对应的项
firstNames.zip(lastNames, function(a) { return a.join(' '); })
// -> ['Justin Palmer', 'Mislav Marohnić', 'Tobie Langel', 'Christophe Porteneuve']
//通过这个例子我们可以看到传入的可以是多个数组
var cities = ['Memphis', 'Zagreb', 'Montreal', 'Paris'];
firstNames.zip(lastNames, cities, function(p) { return p[0] + ' ' + p[1] + ', ' + p[2]; })
// -> ['Justin Palmer, Memphis', 'Mislav Marohnić, Zagreb', 'Tobie Langel, Montreal', 'Christophe Porteneuve, Paris']
firstNames.zip($R(1, 100), function(a) { return a.reverse().join('. '); })
// -> ['1. Justin', '2. Mislav', '3. Tobie', '4. Christophe']
评论 (0) All
