闭包是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。
html 代码
- <input type="button" onclick="b();" />
js 代码
- function myClass(){
- alert('X:' + event.clientX);
- }
- function a(){
- alert('Base...');
- }
- var b = a.create({'event':myClass});
-
-
js 代码
- function a(p1,p2){
- alert(this.getTime());
- alert(p1+'||'+p2);
- }
-
- var b = a.create({'bind':new Date(),'arguments':[100,200]});
- b();
-
-
-
方法:pass
参数列表:
args - 数组形式传入的参数
bind - 可选。this指向的对象
功能:create的功能简化版。实现的即是create中选项'arguments'的功能。
js 代码
- function a(p1,p2){
- alert(p1+'||'+p2);
- }
-
- var b = a.pass([100,200]);
- b();
方法:attempt
参数列表:
args - 数组形式传入的参数
bind - 可选。this指向的对象
功能:create的功能简化版,并且创建闭包函数后执行。实现的即是create中选项'attempt'为true时的功能。
js 代码
- myFunc.attempt([100,200]);
方法:bind
参数列表:
bind - 可选。this指向的对象
args - 可选。数组形式传入的参数
功能:create的功能简化版。实现的即是create中选项'bind'的功能。
js 代码
- function myFunc() {
- this.setStyle('color', 'red');
- }
- var myBoundFunction = myFunction.bind(myElement);
- myBoundFunction();
方法:bindAsEventListener
参数列表:
bind - 可选。this指向的对象
args - 可选。数组形式传入的参数
功能:create的功能简化版。实现的即是create中选项'bind'以及'event'为true时的功能。
js 代码
- function a(){
- this.innerHTML = 'Fired at ('+event.clientX + ',' + event.clientY +')';
- }
-
- $('mybtn').onclick = a.bindAsEventListener($('myDiv'));
方法:delay
参数列表:
ms - 延迟执行的毫秒数
bind - 可选。this指向的对象
args - 可选。数组形式传入的参数
功能:create的功能简化版,并且创建闭包函数后执行。实现的即是create中选'delay'的功能。
js 代码
- function a(){
- alert('Hello...');
- }
- a.delay(1000);
方法:periodical
参数列表:
ms - 间隔执行的毫秒数
bind - 可选。this指向的对象
args - 可选。数组形式传入的参数
功能:create的功能简化版,并且创建闭包函数后执行。实现的即是create中选'periodical'的功能。
js 代码
- function a(){
- alert('Hello...');
- }
- a.periodical(2000);
=============================
Function部分就这些啦,不过也足够强大了!
分享到:
相关推荐
mootools详细教程 mootools框架【一】-Element篇: 方法完全解析 mootools框架【一】-Element篇: 高级应用举例 ...mootools框架【四】-Function篇: 主要方法解析 mootools框架【五】-String篇: 方法完全解析
#### 四、Function篇 Mootools提供了许多增强函数的功能,比如延迟执行、周期执行等功能。 ##### 函数操作方法 - **bind()**:改变函数的上下文(this指针)。 - **delay()**:延迟一定时间后执行函数。 - **...
本篇文章将深入探讨如何在MooTools框架下创建和使用弹出框。 **一、MooTools 的基础** MooTools遵循一个模块化的结构,通过引入核心库和其他可选模块,可以轻松扩展功能。在创建弹出框之前,我们需要确保页面已经...
本篇文章将深入探讨如何使用MooTools在同一页面上实现多种不同的日期选择效果。 首先,我们要理解MooTools的核心理念。MooTools基于Prototype设计模式,通过Class系统提供了面向对象的编程支持,同时它的Selector ...
这篇博客将深入探讨这两个库在实际工作中的常见用法,并进行比较。 首先,Prototype是一个轻量级的JavaScript库,它的核心设计思想是扩展JavaScript的基本类型,让JavaScript对象更加面向对象。在Prototype 1.6中,...
本篇将围绕"Mootools demo打包_mootools.svn.js_中文手册.zip"这一资源展开,深入探讨MooTools的核心概念、主要特性以及在实际开发中的应用。 1. **MooTools核心概念** - **模块化设计**:MooTools遵循CommonJS...
《一周学会Mootools 1.4中文教程》是一篇旨在帮助初学者快速掌握Mootools 1.4版本的中文教程。Mootools是一种功能强大且轻量级的JavaScript库,专门设计用于简化Web中交互式JavaScript的开发工作。在某种程度上,...
在本篇学习笔记中,我们将探讨MooTools的核心概念、主要功能以及如何在实际项目中应用。 1. **核心概念** - **类与对象**:MooTools基于原型的面向对象系统,允许开发者创建自定义类并实例化对象。通过`new Class`...
本篇文章将详细探讨如何利用MooTools 1.2.1版本实现拖拽效果。 **一、MooTools 1.2.1 概述** MooTools 是一个遵循MIT许可证的JavaScript框架,它的设计目标是提供模块化、可扩展和高性能的开发环境。1.2.1版本在...
本篇将深入探讨如何使用MooTools实现动态菜单,并兼容Firefox和Internet Explorer 8。 1. **MooTools简介** MooTools是一个轻量级且模块化的JavaScript框架,其设计理念是提供简洁的API和强大的功能,以简化Web...
本篇将详细介绍Mootools中的Ajax特性及其应用。 #### 二、Mootools的Ajax核心概念 ##### 1. 创建Ajax请求 在Mootools中,创建一个Ajax请求非常简单,只需要一行代码: ```javascript var myRequest = new Request...
本篇文章将深入探讨如何利用 MooTools 实现 Tooltip 效果,以及它在实际应用中的价值。 1. **什么是 Tooltip 和 MooTools?** - Tooltip 是一种网页元素,当用户将鼠标悬停在某个元素上时,会显示一个包含附加信息...
本篇文章将深入探讨Mootools 1.4版本中的DOM选择器,这是学习Mootools的基础之一。 #### 二、准备工作 为了更好地学习Mootools,推荐使用Editplus编辑器,并下载作者提供的`Mootools1.4.zip`素材文件。该素材文件...
本篇将深入探讨如何使用MooTools框架来创建一个竖直滑动的三级下拉菜单导航。 首先,我们需要理解MooTools的基本概念。MooTools是一个基于原型的JavaScript库,它提供了一套面向对象的编程结构,使得开发者能够编写...
在本篇文章中,我们将深入探讨MooTools的DOM操作,包括元素选择、创建、属性操作、事件处理以及动画效果。 首先,MooTools提供了多种方法来选取DOM元素。`$$`函数是MooTools中最常用的元素选择器,它可以接受CSS...
在本篇中,我们将深入探讨如何利用MooTools实现分页和多选搜索的特效代码。 ### 1. 分页功能 分页是网页中常见的数据展示方式,尤其在处理大量数据时,能够提高用户体验。MooTools通过提供`Pages`模块来实现这一...
本篇将深入探讨如何使用MooTools实现页面滚动时浮动层的智能定位。 首先,我们来看一下给出的HTML代码片段: ```html 我是个腼腆羞涩的浮动层... ``` 这是一个简单的div元素,具有`class`为`float`和`id`为`...
在本篇文章中,我们将深入探讨jQuery、MooTools和Prototype这三大JavaScript库及其示例,帮助你更好地理解它们各自的特点、用途以及如何在实际项目中运用。 jQuery是一个轻量级、高性能的JavaScript库,由John ...
这篇内容将深入解析这三个技术以及它们如何在MyEclipse 8.5环境中协同工作。 Servlet是Java的一种标准,用于扩展服务器的功能,特别是在Web应用中处理HTTP请求。Servlet容器(如Tomcat或Jetty)接收HTTP请求,将其...