MooTools1.3.1 API(Core)学习及试译(三)——Types(二)

写在前面:由于自身英语水平有限,所以翻译不敢保证能让所有人都理解,如果您在阅读中发现什么疑问,请务必及时查看官方API,以免误导。另外,有部分是未经翻译的,一方面是因为找不到合适的中文描述之,还有就是有的地方看英文更易懂~

续上一篇MooTools1.3.1 API(Core)学习及试译(一)——Types(一)

这一篇继续Types,包含Number、Function、Object、Event

归纳一下Number、Function、Object、Event方法如下:

Number Number.from:把传入的参数转换为数值,返回null或数值
Number.random:返回一个介于传入参数之间的随机整数
limit:限制当前的数值结缘传入参数之间
round:当前数值四舍五入到指定的精度
times:按指定的次数执行传入的函数
toFloat:返回数值的浮点值
toInt:根据传入的基数,转换当前数值为其他数值(比如二进制等)
Number.Math:Math对象中的一些方法也可以使用在Number对象中
Function Function.from:如果传入的参数是一个函数,则返回这个函数本身,否则返回一个返回传入参数的函数
Function.attempt:执行一系列传入的函数,在遇到第一个执行成功的函数时立刻返回这个函数的返回值,而不再连续执行后面的函数,当所有传入的函数都执行失败时返回null
extend:使用新的方法或属性扩展一个函数
implement:在原型prototype上扩展函数
attempt:尝试执行一个函数,当这个函数执行成功时立即返回这个函数的返回值,如果执行不成功则返回null
pass:返回一个闭包
bind:改变目标函数中作用域的this,指向要绑定的参数(将当前函数绑定到另外一个对象上)
delay:按照指定的时间延时执行函数
periodical:在指定的时间间隔执行函数,可以用clearInterval来清除
Object Object.each:循环迭代一个对象
Object.merge:递归地合并对象而不拼接它们的子对象
Object.clone:返回一个对象的副本(克隆)
Object.append:拷贝传入的第二个参数(对象)的所有属性到第一个参数(对象)中
Object.subset:获取一个对象的子集
Object.map:创建一个新的映射(map)并在每一个映射上调用传入的方法
Object.filter:返回当前对象中能使传入的方法返回true的所有元素的一个新对象
Object.every:如果对象的每一个值都满足传入的测试方法时返回ture
Object.some:对象只要有一个值满足传入的测试方法即返回true
Object.keys:返回一个包含当前对象所有名称(key)的数组
Object.values:返回一个包含当前对象所有值(value)的数组
Object.getLength:返回对象中键/名称(key)的个数
Object.keyOf:返回对象中某个指定值的键名,如果不存在这个值则返回false
Object.contains:检测某个指定的值在对象中是否存在,存在时返回true,否则false
Object.toQueryString:根据对象的名值对返回一个值经过编译的查询字符串
Object constructor:构造函数
stop:阻止事件传播以及取消事件默认动作
stopPropagation:阻止事件传播
preventDefault:阻止事件的默认动作
//Type: Number
//Number对象的一些函数和方法的集合

Function: Number.from
把传入的参数转换为数值,返回null或数值
Number.from(arg);

alert(Number.from('10'));//10
alert(Number.from('string'));//null

Function: Number.random
返回一个介于传入参数之间的随机整数
var random = Number.random(min, max);

Number.random(5, 20); // returns a random number between 5 and 20.

Number method: limit
限制当前的数值结缘传入参数之间
myNumber.limit(min, max);

alert((2.5).limit(4, 5));//4
alert((10).limit(4, 5));//5
alert((4.5).limit(4, 5));//4.5

Number method: round
当前数值四舍五入到指定的精度
myNumber.round([precision]);
参数:precision - (number, optional: defaults to 0) 小数点后小数位

alert((14.45).round());//14
alert((14.45).round(1));//14.5
alert((14.45).round(-1));//10
alert((16.8).round(-1));//20
alert((-14.45).round(1));//-14.4

Number method: times
按指定的次数执行传入的函数
myNumber.times(fn[, bind]);
参数:
fn - (function) 在每次循环迭代时执行的函数,This function is passed the current iteration's index.
bind - (object, optional) 指定函数中this指向的对象

(5).times(alert);//alert 0 --> 1 --> 2 --> 3 --> 4

Number method: toFloat
返回数值的浮点值
myNumber.toFloat();

alert((120).toFloat());//120
alert((120.120).toFloat());//120.12

Number method: toInt
根据传入的基数,转换当前数值为其他数值(比如二进制等)

alert((111).toInt());//111
alert((111.1).toInt());//111
alert((111).toInt(2));//7

Math Methods
Math对象中的一些方法也可以使用在Number对象中
这些方法包括:abs、acos、asin、atan2、ceil、cos、exp、floor、log、max、min、pow、sin、sqrt、tan

alert((3.3).ceil());//4
alert((9).sqrt(2));//3


//Type: Function

Function: Function.from
如果传入的参数是一个函数,则返回这个函数本身,否则返回一个返回传入参数的函数
var foo = Function.from(obj);
参数:obj - (mixed) 如果参数是函数,则简单返回这个函数,否则是一个希望转换成函数的对象
返回:(function) 返回传入的函数或一个返回传入参数的匿名函数

var fn = Function.from(10);
alert(fn());//10
var fn2 = Function.from(fn);
alert(fn2());//10

Function: Function.attempt
执行一系列传入的函数,在遇到第一个执行成功的函数时立刻返回这个函数的返回值,而不再连续执行后面的函数,当所有传入的函数都执行失败时返回null
Function.attempt(fn[, fn, fn, fn, ...]);

var rel = Function.attempt(function() {
	return data;
}, function() {
	return 'hello!';
}, function() {
	return 'world!';
});
alert(rel);//hello!

Function method: extend
使用新的方法或属性扩展一个函数
myFunction.extend(key, value);
参数:
key - (string) 方法或属性名
value - (mixed) 方法或属性值
或者:
myFunction.extend(object);
参数:object - (object) 一个包含多个名/值对的对象

var O = function() {};
O.extend('say', function() {
	alert('hello!');
});
O.say();//'hello!'

var fn = function() {};
fn.extend('type', 'func');
alert(fn.type);//func

Function method: implement
在原型prototype上扩展函数
myFunction.implement(key, value);(参数extend)
或者:
myFunction.implement(object);(参数extend)

var Fn = function() {};
Fn.implement('say', function(s) {
	alert(s);
});
Fn.prototype.say('prototype');//prototype

var fn = new Fn();
fn.say('instance');//instance

说明:implement和extend的不同在于前者添加属性值或方法到function的原型上,因此此function的每一个实例都将拥有添加的属性或方法,
而后者则只添加方法或属性在单一的实例上

Function method: attempt
尝试执行一个函数,当这个函数执行成功时立即返回这个函数的返回值,如果执行不成功则返回null
var myFunctionResult = myFunction.attempt(args[, bind]);
参数:
args - (mixed) 要在函数中执行的一个或一组参数
bind - (object, optional) 指定方法中this指向的对象

var myFn = function() {return this.makeUp.obj;}
console.log(myFn.attempt());//null

var myFunc = function(arg) {return arg;}
console.log(myFunc.attempt(false));//false

Function method: pass
返回一个闭包
var newFunction = myFunction.pass([args[, bind]]);
参数:
args - (mixed, optional) 要传入到方法中的参数,如果是多个参数,则需以数组的形式传入
bind - (object, optional) 方法中this指向的对象
返回:(function) 参数被传入并被调用的这个方法

var myFn = function() {
	var rel = 'Passed: ';
	for(var i=0; i<arguments.length; i++) {
		rel += arguments[i] + ' ';
	}
	return rel;
}
console.log(myFn.pass('hello')());//Passed: hello 
console.log(myFn.pass(['fish', 'bird', 'cat'])());//Passed: fish bird cat 

Function method: bind
改变目标函数中作用域的this,指向要绑定的参数(将当前函数绑定到另外一个对象上)
myFunction.bind([bind[, arg1, arg2, ...]]);
参数:
bind - (object, optional) 要绑定的对象(this指向的对象)
arg1, arg2, ... - (mixed, optional) 需要传入的参数,如果已经绑定的函数被调用这些参数和其他的参数将合并(连接)
返回:(function) 已经绑定的函数

var fn = function(property, value) {
	this.setStyle(property, value);
}
var myFn = fn.bind($('b'));
myFn('color', '#0F0');
//或者 fn.call($('b'), 'color', '#0F0');

Function method: delay
按照指定的时间延时执行函数
var timeoutID = myFunction.delay(delay[, bind[, args]]);
参数:
delay - (number) 要延迟的时间(ms).
bind - (object, optional) 要绑定的对象
args - (mixed, optional) 要传入的参数(must be an array if the arguments are greater than one)
返回:(number) The JavaScript timeout id (for clearing delays)

var fn = function() {alert(this.id);}
fn.delay(3000, $('b'));//b

(function() {alert('Hello!');}).delay(3000);

var fn = function() {alert(this.id);}
var timer = fn.delay(3000, $('b'));//b
clearTimeout(timer);

Function method: periodical
在指定的时间间隔执行函数,可以用clearInterval来清除
var intervalID = myFunction.periodical(period[, bind[, args]]);

var Counter = {counter: 0};
var add = function() {console.log(this.counter ++);}
var timer = add.periodical(3000, Counter);

clearInterval(timer);


//Type: Object
//A collection of Object functions

Function: Object.each
循环迭代一个对象
Object.each(obj, fn[, bind]);
参数:
obj - (object) 要迭代的对象
fn - (function) 每次遍历执行的函数
bind - (object, optional) 需要绑定的对象
fn语法:fn(item, key, object)
参数:
item - (mixed) 数组的当前项
key - (mixed) 当前项的名称
object - (mixed) The actual array/object

var o = {first: 'Mon', second: 'Tue', three: 'Wed'};
Object.each(o, function(item, key) {
	console.log(key + ':' + item);//first:Mon second:Tue three:Wed
});

Function: Object.merge
递归地合并对象而不拼接它们的子对象
var merged = Object.merge(obj1, obj2[, obj3[, ...]]);

var o1 = {a: 1};
var o2 = {b: 2};
var o3 = {c: 3};
var merged = Object.merge(o1,o2,o3);//{a:1,b:2,c:3}
alert(merged == o1);//true
//o1将改变,作为合并后的对象返回,而o2和o3不变~

var O1 = {a: {b:1, c:1}};
var O2 = {a: {b:2}};
var rel = Object.merge(O1, O2);
console.log(rel);//{a: {b: 2, c: 1}}

Function: Object.clone
返回一个对象的副本(克隆)
var clone = Object.clone(obj);

var O = {a:0, b:1};
var copy = Object.clone(O);
O.a = 2;
console.log(copy.a);//0

Function: Object.append
拷贝传入的第二个参数(对象)的所有属性到第一个参数(对象)中
Object.append(original, extension);

var p1 = {
	name: 'chemdemo',
	age: 23
};
var p2 = {
	name: 'demo',
	sex: 'male',
	status: 'student',
	school: 'sysu'
};
var me = Object.append(p1, p2);
console.log(me);//{name:'demo', age: 23, sex: 'male', status: 'student', school: 'sysu'}

Function: Object.subset
获取一个对象的子集
Object.subset(object, keys);
参数:
object - (object) 当前对象
keys - (array) An array with the keys
返回:(object) The subset of the Object

var o = {a: 1,b: 2,c: 3};
console.log(Object.subset(o, ['a', 'c']));//{a: 1, c: 3}

Function: Object.map
创建一个新的映射(map)并在每一个映射上调用传入的方法
var mappedObject = Object.map(object, fn[, bind]);
参数:
object - (object) 当前对象
fn - (function) 一个从当前元素创建一个元素对象的方法
bind - (object, optional) 需要绑定的对象(The object to use as 'this' in the function)
fn语法:fn(value, key, object)
参数:
value - (mixed) 对象当前值的
key - (string) 对象当前值的名称
object - (object) The actual object
返回:(object) The new mapped object

var o = {a: 1, b: 2, c: 3};
console.log(Object.map(o, function(value, key) {
	return value + 1;
}));//{ a:2, b:3, c:4}

Function: Object.filter
返回当前对象中能使传入的方法返回true的所有元素的一个新对象
var filteredObject = Object.filter(object, fn[, bind]);//参数类似Object.map

var o = {a: 1, b: 2, c: 3, d: 4};
console.log(Object.filter(o, function(value, key) {
	return value > 3;
}));//{d:4}

Function: Object.every
如果对象的每一个值都满足传入的测试方法时返回ture
var allPassed = Object.every(object, fn[, bind]);//参数类似Object.map

var o = {a: 10, b: 20, c: 30};
console.log(Object.every(o, function(value, key) {return value > 20};));//false

Function: Object.some
对象只要有一个值满足传入的测试方法即返回true
var anyPassed = Object.some(object, fn[, bind]);//参数类似Object.map

var o = {a: 10, b: 20, c: 30};
console.log(Object.some(o, function(value, key) {return value > 20};));//true

Function: Object.keys
返回一个包含当前对象所有名称(key)的数组
var keys = Object.keys(object);

var o = {name: 'demo', age: 23, school: 'sysu'};
console.log(Object.keys(o));//["name", "age", "school"]

Function: Object.values
返回一个包含当前对象所有值(value)的数组
var keys = Object.values(object);

var o = {name: 'demo', age: 23, school: 'sysu'};
console.log(Object.values(o));//["demo", 23, "sysu"]

Function: Object.getLength
返回对象中键/名称(key)的个数
var length = Object.getLength(object);

var o = {name: 'demo', age: 23, school: 'sysu'};
console.log(Object.getLength(o));//3

Function: Object.keyOf
返回对象中某个指定值的键名,如果不存在这个值则返回false
var key = Object.keyOf(object, item);

console.log(Object.keyOf({name: 'chemdemo', male: true}, true));//male

Function: Object.contains
检测某个指定的值在对象中是否存在,存在时返回true,否则false
var inObject = Object.contains(object, value);

var o = {a: 1, b: 'b', c: false};
console.log(Object.contains(o, 'b'));//true
console.log(Object.contains(o, 0));//false

Function: Object.toQueryString
根据对象的名值对返回一个值经过编译的查询字符串
var queryString = Object.toQueryString(object[, base]);
参数:
object - (object) 传入一个对象
base - (string, optional) 将在查询字符串中用作基变量(base variable)的字符串
返回:(string) The query string

var o = {name: 'chemdemo', age: 23};
console.log(Object.toQueryString(o));//'name=chemdemo&age=23'
console.log(Object.toQueryString(o, 'me'));//'me[name]=chemdemo&me[age]=23'


//Type: Event
//MooTools事件方法集

Event Method: constructor
new Event([event[, win]]);
参数:
event - (event, required) An HTMLEvent Object.一个HTML事件对象
win - (window, optional:默认是window) 事件上下文

属性(Properties):
page.x - (number) 相对于整个窗口(full window)鼠标位置的x坐标
page.y - (number) 相对于整个窗口(full window)鼠标位置的y坐标
client.x - (number) 相对于视窗(viewport)鼠标位置的x坐标
client.y - (number) 相对于视窗(viewport)鼠标位置的y坐标
rightClick - (boolean) 如果用户点击鼠标右键则event.rightClick值为true
wheel - (number) The amount of third button scrolling.滚动的数量
relatedTarget - (element) 目标事件的相关元素
target - (element) The event target
code - (number) 按下键的键码
key - (string) 小写的被按下的键键名,可以是'enter', 'up', 'down', 'left', 'right', 'space', 'backspace', 'delete', 和 'esc'
shift - (boolean) 如果shift键被按下则event.shift值为true
control - (boolean) 如果ctrl键被按下则event.control值为true
alt - (boolean) 如果alt键被按下则event.alt值为true
meta - (boolean) 如果meta键被按下则event.meta值为true

$('myLink').addEvent('click', function(event) {
	event.stop();
	this.addEvent('keydown', function(event) {
		alert(event.key);// returns the lowercase letter pressed
		alert(event.shift);// returns true if the key pressed is shift
		if(event.control && event.key == 's') {event.stop();alert('Saved!');};
	});
});

说明:
1、访问event.page或者event.client时需要页面在标准模式下
2、每一个经addEvent添加的事件将自动添加MooTools的方法,而不需要人工引用

Event Method: stop
阻止事件传播以及取消事件默认动作
myEvent.stop();

$('myLink').addEvent('click', function(event){
    event.stop(); //Prevents the browser from following the link.
    this.set('text', 'Where do you think you\'re going?'); //'this' is Element that fires the Event.
    (function(){
        this.set('text','Instead visit the Blog.').set('href', 'http://blog.mootools.net');
    }).delay(5000, this);
});

说明:返回false时在方法内部仍然可以阻止事件传播

Event Method: stopPropagation
阻止事件传播
myEvent.stopPropagation();

$('myLink').addEvent('click', function(event) {
	alert('The link a#myLink element has clicked!');
	//event.stopPropagation();
});
document.body.addEvent('click', function() {
	alert('The click event has spread to HtmlBodyElement!');
});

Event Method: preventDefault
阻止事件的默认动作
myEvent.preventDefault();

$('myLink').addEvent('click', function(event){
    event.preventDefault(); //prevents the a#myLink element from being "clicked".
});

//Object: Event.Keys
通过给Event.Keys对象添加属性可以附加额外的事件键码
可以添加的键:enter、up、down、left、right、esc、space、backspace、tab、delete
posted @ 2011-04-05 23:34  chemdemo  阅读(425)  评论(0编辑  收藏  举报