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