mootools框架【四】-Function篇: 主要方法解析

mootools【四】- Function篇 

内容说明: 

     闭包是javascript中非常强大的工具， 在实际应用开发中，我们基本上都会用到。从各个javascript框架中，我们也可以到处看到闭包的影子。mootools在javascript的Function上扩展出了一些十分方便的创建函数闭包的方法，其中一些我们在prototype.js中也使用过，类如bind,bindAsEventListener等。

     对Function的扩展，mootools主要提供了一个create方法来创建闭包，这个方法其实实现了mootools对Function的所有扩展功能,但是一般我们不会直接去用它，而是使用mootools基于这个create方法派生出的其他方法。

1. 方法：create

参数选项列表：

bind ： 创建的闭包函数中this所指向的对象。默认指向当前函数。

event： 默认为false；如果为true,则创建的闭包函数将会作为一个事件监

 听器，传入的第一个参数是一个event对象；如果为一个类名，则

 会创建这个类的一个实例,并把event对象传入该类

    arguments：一个以数组形式传入创建的闭包函数的参数列表。如果同时指    定了上面的event选项和本arguments选项,则事件对象event  对象将作为参数列表中的第一个，而其他参数排在其后。

delay：延迟执行的毫秒数(setTimeout的功能)。默认不延迟执行。如果指定

      了，则调用该创建的闭包函数时将按指定的毫秒数延迟执行（调用返

      回一个时间处理句柄）。

periodical：间隔执行的毫秒数(setInterval的功能)。默认不进行间隔执行。

          如果指定了，则调用该创建的闭包函数后，会每间隔指定的毫秒

          数后触发执行(调用返回一个时间处理句柄)。

attempt：如果指定为true,则再创建闭包的过程中，将会使用捕捉异常，如

         果无异常抛出，则返回正常的闭包函数；如果发生异常，则返回          捕捉到的异常对象。默认为false。

例子：

<input type="button" value="test" onclick="b()"/>

function myClass(){

  alert('X:' + event.clientX);

}

function a(){

  alert('Base...');

}

var b = a.create({'event':myClass});

//按下按钮后，将先alert出如"X:33"，接着alert

  function a(p1,p2){

 alert(this.getTime());

 alert(p1+'||'+p2);

}

var b = a.create({'bind':new Date(),'arguments':[100,200]});

b();

//alert出如"1233445"

//alert出"100||200"

 

2. 方法：pass

参数列表：

args： 数组形式传入的参数

bind： 可选。this指向的对象

作用：create的功能简化版。实现的即是create中选项'arguments'的功能。

例子：

function a(p1,p2){

alert(p1+'||'+p2);

}

var b = a.pass([100,200]);

b();

 

3. 方法：attempt

参数列表：

args：数组形式传入的参数

bind：可选。this指向的对象

作用：create的功能简化版,并且创建闭包函数后执行。实现的即是create

     中选项'attempt'为true时的功能。

例子：myFunc.attempt([100,200]);

 

4. 方法：bind

参数列表：

bind：可选。this指向的对象

args：可选。数组形式传入的参数

作用：create的功能简化版。实现的即是create中选项'bind'的功能。

例子：

function myFunc() {

     this.setStyle('color', 'red');

}

var myBoundFunction = myFunction.bind(myElement);

myBoundFunction(); 

 

5. 方法：bindAsEventListener

参数列表：

bind：可选。this指向的对象

args：可选。数组形式传入的参数

作用：create的功能简化版。实现的即是create中选项'bind'以及'event'为true

时的功能。

例子：

<div id="myDiv"></div>

<input type="button" id="mybtn" value="test" />

function a(){

  this.innerHTML = 'Fired at ('+event.clientX + ',' + event.clientY +')';

}

$('mybtn').onclick = a.bindAsEventListener($('myDiv'));

 

6. 方法：delay

参数列表：

ms：延迟执行的毫秒数

bind：可选。this指向的对象

args：可选。数组形式传入的参数

作用：create的功能简化版,并且创建闭包函数后执行。实现的即是create中选

   'delay'的功能。

例子：

function a(){

  alert('Hello...');

}

a.delay(1000);

 

7. 方法：periodical

参数列表：

ms：间隔执行的毫秒数

bind：可选。this指向的对象

args：可选。数组形式传入的参数

作用：create的作用简化版,并且创建闭包函数后执行。实现的即是create中选

   'periodical'的作用。

例子：

function a(){

  alert('Hello...');

}

a.periodical(2000);