mootools是面向对象的写法,可以像as那样理解它,它有多个单元组成,这些单元又由更小的单元构成,而且彼此之间可以轻松扩展和继承。
那么现在我们先从Array这个类开始。
先给大家一个表,我自己归纳的。
方法名称与格式 | 方法作用与内容 |
Array.each([...], function(item,index){do sth}) | 循环数组的对象 |
Array.clone({array}) | 克隆一个数组并返回 |
Array.from(obj) | 转为数组并返回 |
Array.each(function(){do sth}) | 类似Array.each([...],funciton(){item,index}) |
Array.invoke(fun) | 将方法一一作用到数组对象上并返回 |
Array.every(fun) | 判断数组中所有对象是否满足对应方法,并返回布尔值 |
Array.filter(fun) | 根据条件过滤后返回数组,里面保留顺利通过地对象 |
Array.clean() | 用于清理非数组对象,生成一个“纯”数组 |
Array.indexOf(obj) | 用于返回对象在数组中的位置 |
Array.map(fun) | 方法遍历过所有数组对象后生成的结果返回一个新的数组 |
Array.some(fun) | 判断数组中是否有对象满足条件,并返回布尔值 |
Array.associate(Array) | 两数组关联成json对象,前者为为对象内容,后者为对象名称 |
Array.link(‘name1’:requirement1,'name2':requirement2,...) | 根据条件进行关联 |
Array.contains(obj) | 判断是否含有该对象,返回布尔值 |
Array.append(obj) | 追加对象在数组最后 |
Array.getLast() | 取数组最后的对象 |
Array.getRandom() | 取数组中任意一对象 |
Array.include(obj) | 高级的追加,如果重复则不会重复追加 |
Array.combine(Array) | 结合两个数组为一个数组 |
Array.empty() | 清空数组中对象 |
Array.erase(obj) | 从数组中清除该对象 |
Array.flatten() | 将多维数组或混型数组转为普通数组 |
Array.pick() | 挑选出数组中有意义的第一个对象值 |
myArray.hexToRgb([array]); myArray.rgbToHex([array]); |
颜色值转换 |
Array类中的方法,我们先从这个开始:
Function: Array.each 循环数组的对象
var m = ['a','b','c','d'];
Array.each(m,function(content,index){
console.log(index+":"+content)
})
Function: Array.clone 复制数组
var myArray = ['red', 'blue', 'green'];
var otherArray = Array.clone(myArray);
Function: Array.from 转换为数组
Array.from('hello'); // returns ['hello'].
Array.from(['a', 'b', 'c']); // returns ['a', 'b', 'c'].
Array method: each 循环数组对象
其实这个方法和之前的Array.each这个可以交替着用。
//Alerts "0 = apple", "1 = banana", and so on:
['apple', 'banana', 'lemon'].each(function(item, index){
console.log(index + " = " + item);
});
Array method: invoke 根据给定的方法作用在数组的各个对象上面
var foo = [4, 8, 15, 16, 23, 42];
var bar = foo.invoke('limit', 10, 30); //bar is now [10, 10, 15, 16, 23, 30]
正如上面所示,假设有一个名叫limit的方法,现在通过Array.invoke(method, [obj]), 调用Limit方法,作用在每个数组对象上。
Array method: every 判断数组每个对象是否所指定的方法,即返回的是布尔值。
var areAllBigEnough = [10, 4, 25, 100].every(function(item, index){
return item > 20;
}); // areAllBigEnough = false
Array method: filter 与Array.every为兄弟,用于返回条件所过滤出来的对象,并以数组形式返回。
var biggerThanTwenty = [10, 3, 25, 100].filter(function(item, index){
return item > 20;
}); // biggerThanTwenty = [25, 100]
Array method: clean 清楚不能定义为数组对象的对象,返回一个“纯”数组。
var myArray = [null, 1, 0, true, false, 'foo', undefined, ''];
myArray.clean() // returns [1, 0, true, false, 'foo', '']
Array method: indexOf 返回对象所在数组中的位置
['apple', 'lemon', 'banana'].indexOf('lemon'); // returns 1
['apple', 'lemon'].indexOf('banana'); // returns -1
Array method: map 根据方法内容遍历数组对象后,再返回作用后的数组内容
var timesTwo = [1, 2, 3].map(function(item, index){
return item * 2;
}); //timesTwo = [2, 4, 6];
Array method: some 与Array.every比较记忆。也是测试数组中对象是否满足指定方法,并返回布尔值,不同Array.every的是,Array.some是只要数组中有任意对象符合指定方法,就返回true, 只有当数组中无一对象满足时才返回false。
var isAnyBigEnough = [10, 4, 25, 100].some(function(item, index){
return item > 20;
}); // isAnyBigEnough = true
Array method: associate 将两组数组对象进行关联,并组成多个对象集合
var animals = ['Cow', 'Pig', 'Dog', 'Cat'];
var sounds = ['Moo', 'Oink', 'Woof', 'Miao'];
sounds.associate(animals);
// returns {'Cow': 'Moo', 'Pig': 'Oink', 'Dog': 'Woof', 'Cat': 'Miao'}
如果两组数组对象个数不一,不能完全组合成多个对象,那么能配成多少,就返回多少。再顺便说一点,Array.associate(Array)中,前面Array是对象内容,后者为对象的名称。
Array method: link 这个方法更加具体,能够关联更加具体的Array内容。
var el = document.createElement('div');
var arr2 = [100, 'Hello', {foo: 'bar'}, el, false];
arr2.link({
myNumber: Type.isNumber,
myElement: Type.isElement,
myObject: Type.isObject,
myString: Type.isString,
myBoolean: function(obj){ return obj != null; }
});
// returns {myNumber: 100, myElement: el, myObject: {foo: 'bar'}, myString: 'Hello', myBoolean: false}
分析下结构:
Array.link({'name1':Type.isNumber, 'name2': Type.isString,.....})
Array method: contains 用于测试是否含有对应的对象内容,并返回布尔值。
['a', 'b', 'c'].contains('a'); // returns true
['a', 'b', 'c'].contains('d'); // returns false
Array method: append 为数组追加内容
var myOtherArray = ['green', 'yellow'];
['red', 'blue'].append(myOtherArray); // returns ['red', 'blue', 'green', 'yellow'];
[0, 1, 2].append([3, [4]]); // [0, 1, 2, 3, [4]]
Array method: getLast 返回数组中最后一个对象
['Cow', 'Pig', 'Dog', 'Cat'].getLast(); // returns 'Cat'
Array method: getRandom 返回数组中任意一对象
['Cow', 'Pig', 'Dog', 'Cat'].getRandom(); // returns one of the items
Array method: include Array.append的优化版:只为数组追加新的对象,若该对象在原数组中存在,则不再追加。
['Cow', 'Pig', 'Dog'].include('Cat'); // returns ['Cow', 'Pig', 'Dog', 'Cat']
['Cow', 'Pig', 'Dog'].include('Dog'); // returns ['Cow', 'Pig', 'Dog']
Array method: combine 连接数组,若数组中有重复对象,则在新生成的数组中不再重复。
var animals = ['Cow', 'Pig', 'Dog'];
animals.combine(['Cat', 'Dog']); //animals = ['Cow', 'Pig', 'Dog', 'Cat'];
Array method: erase 从数组中移除某对象,若无该对象,则不发生任何变化。
['Cow', 'Pig', 'Dog', 'Cat', 'Dog'].erase('Dog') // returns ['Cow', 'Pig', 'Cat']
['Cow', 'Pig', 'Dog'].erase('Cat') // returns ['Cow', 'Pig', 'Dog']
Array method: empty 清空数组中对象。
var myArray = ['old', 'data'];
myArray.empty(); //myArray is now []
Array method: flatten 将多维数组和无规律数组转为一组普通数组
var myArray = [1,2,3,[4,5, [6,7]], [[[8]]]];
var newArray = myArray.flatten(); //newArray is [1,2,3,4,5,6,7,8]
Array method: pick 挑选出数组中第一个有效的对象
console.log([null, null, 'There was no message supplied.'].pick()); //return the third content
另外还有两个方法,他们是颜色值的转换。这里不说了,有兴趣自己可以去官网学习。