zoukankan      html  css  js  c++  java
  • mootools【四】 Function篇

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

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

    方法: 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"

    方法:pass

    参数列表:

    args - 数组形式传入的参数

    bind - 可选。this指向的对象

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

    function a(p1,p2){
     alert(p1+'||'+p2);
    }

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

    方法:attempt

    参数列表:

    args - 数组形式传入的参数

    bind - 可选。this指向的对象

    功能:create的功能简化版,并且创建闭包函数后执行。实现的即是create中选项'attempt'为true时的功能。

    myFunc.attempt([100,200]);

    方法:bind

    参数列表:

    bind - 可选。this指向的对象

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

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

    function myFunc() {
      this.setStyle('color', 'red');
    }
    var myBoundFunction = myFunction.bind(myElement);
    myBoundFunction();

    方法: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'));

    方法:delay

    参数列表:

    ms - 延迟执行的毫秒数

    bind - 可选。this指向的对象

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

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

    function a(){
     alert('Hello...');
    }
    a.delay(1000);

    方法:periodical

    参数列表:

    ms - 间隔执行的毫秒数

    bind - 可选。this指向的对象

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

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

    function a(){
     alert('Hello...');
    }
    a.periodical(2000);

    =============================

    Function部分就这些啦,不过也足够强大了!

  • 相关阅读:
    毕设进度28
    任务27
    任务26
    任务25
    任务24
    第二次冲刺
    课堂作业-搜狗输入法
    课堂作业-寻找水王
    博客花园典型用户和场景
    第十天
  • 原文地址:https://www.cnblogs.com/luluping/p/1181720.html
Copyright © 2011-2022 走看看