`

[ExtJS3.2源码每天一小时]ExtJS对Function类的扩展(之九)

阅读更多
Ext对Function类的扩展主要包括方法:常见函数执行拦截器、创建回调函数、延迟函数执行。
Ext.apply(Function.prototype, {
   //函数执行拦截器 fcn-拦截器函数
  createInterceptor: function(fcn, scope){
        //this指代当前要加拦截器的function 下文简称this函数
        var method = this;
        //判断当前fcn拦截器是否是一个函数,如果是返回的是执行拦截器和this函数的一个新函数,如果不是返回的是this函数。
        return !Ext.isFunction(fcn) ?
                this :
                //下面这个function称作deal函数(依次执行拦截函数和this函数)
                function() {
                    //此处的this指的是deal函数
                    var me = this,
                    //arguments指代deal函数的参数
                    args = arguments;
                    //设置拦截器的拦截目标为deal函数
                    fcn.target = me;
                    //设置拦截器的正常方法为this函数
                    fcn.method = method;
                    //首先执行拦截器,如果拦截器不返回false,那么继续执行this函数,如果拦截器返回false,那么this函数将不执行。
                    return (fcn.apply(scope || me || window, args) !== false) ?
                            method.apply(me || window, args) :
                            null;
                };
    },
   //创建function特定参数的回调函数
   createCallback: function(){
        var args = arguments,
            method = this;
        return function() {
            return method.apply(window, args);
        };
    },
    //创建function指定参数的回调函数
     //obj指代的是作用域
     //args指代的是要回传给执行函数的参数,一旦指定args,并且appendArgs不传,那么就覆盖原有函数的参数;
     //appendArgs可以传两种类型 布尔值:代表是否追加参数 数字值:代表追加的位置
   createDelegate: function(obj, args, appendArgs){
        //保存当前函数的引用
        var method = this;
        return function() {
            //声明回调时传入的参数
            var callArgs = args || arguments;
            //是否追加参数,即createDelegate传的args参数是否追加到当调用回调函数时传入的参数数组里面
            if (appendArgs === true){
                //先将回调函数的参数转为数组形式,因为arguments并不是一个数组
                callArgs = Array.prototype.slice.call(arguments, 0);
                //将args参数追加到回调参数中
                callArgs = callArgs.concat(args);
            }
            //如果appendArgs是数字
            else if (Ext.isNumber(appendArgs)){
                //先将回调函数的参数转为数组形式,因为arguments并不是一个数组
                callArgs = Array.prototype.slice.call(arguments, 0); 
                //从appendArgs位置向callArgs插入args参数
                var applyArgs = [appendArgs, 0].concat(args); 
                Array.prototype.splice.apply(callArgs, applyArgs); // splice them in
            }
            //执行函数
            return method.apply(obj || window, callArgs);
        };
    },
    //延迟执行函数
     //millis:延迟执行的毫秒数
     //obj:作用域
     //args:创建回调函数的参数
     //appendArgs:是否追加参数
   defer: function(millis, obj, args, appendArgs){
        //创建回调函数
        var fn = this.createDelegate(obj, args, appendArgs);
        //应用延迟
        if(millis > 0){
            //millis后执行fn
            return setTimeout(fn, millis);
        }
        //如果millis小于零或者是其他非数字值,直接执行fn
        fn();
        return 0;
    },
    //创建函数之后顺序执行的一个函数
    createSequence : function(fcn, scope){
        var method = this;
        return (typeof fcn != 'function') ?
                this :
                function(){
                    var retval = method.apply(this || window, arguments);
                    fcn.apply(scope || this || window, arguments);
                    return retval;
                };
    }
});


分享到:
评论

相关推荐

    ExtJS 3.2的中文参考手册

    - **核心概念**: `Element` 是ExtJS中最基础的对象之一,它提供了对DOM元素的操作能力,如获取、设置样式等。 - **获取DOM节点**: 使用 `Ext.get()` 方法可以获取DOM节点,例如:`var el = Ext.get('someId');`。 ...

    extjs时间控件精确秒

    在EXTJS这个强大的JavaScript框架中,时间控件是开发者经常使用的组件之一,尤其在构建复杂的Web应用程序时。EXTJS的时间控件允许用户选择或输入时间,通常以小时、分钟和秒为单位,提供了用户友好的界面和丰富的...

    Extjs源码之--Ext事件机制/继承关系

    在“Extjs源码之--Ext事件机制/继承关系”中,我们将深入探讨EXTJS如何处理事件以及其类层次结构。EXTJS的事件处理主要由EventManager.js这个文件负责,它是EXTJS事件系统的基础。 首先,EXTJS的事件机制基于观察者...

    EXTJS事件实例源码

    EXTJS事件系统是其核心特性之一,它使得组件间的交互变得简单而直观。通过深入理解EXTJS事件,我们可以更好地利用EXTJS构建高效、可维护的Web应用。 EXTJS事件实例源码的学习可以帮助我们掌握以下关键知识点: 1. ...

    ExtJS 设计模式之一.docx

    单例模式是ExtJS设计模式之一,通过合理的使用可以极大地提升代码的质量和效率。了解和掌握单例模式不仅可以帮助我们在日常开发中编写出更好的代码,还可以让我们更加深刻地理解JavaScript的核心机制。

    extjs4.2 分页combo动态条数 源码

    EXTJS 4.2 是一个流行的JavaScript框架,用于构建富客户端Web应用程序。在这个场景中,我们关注的是在EXTJS的Combobox(下拉框)组件中实现分页和动态加载数据的功能。Combobox通常用于展示有限数量的选项,但在大...

    ExtJs 类的设计

    它的类系统是其核心特性之一,借鉴了面向对象编程的概念,使得在JavaScript中可以实现结构化、可复用的代码。这篇博客文章“ExtJs 类的设计”可能深入探讨了如何在ExtJs中有效地设计和使用类。 1. **类的定义** 在...

    ExtJs 动态添加表单

    在ExtJS中,我们可以使用`Ext.container.Container`类来创建一个容器,然后设置布局为`form`,以便容纳表单字段。例如: ```javascript var formPanel = Ext.create('Ext.form.Panel', { layout: 'form', items...

    Extjs6.x插件,双击关闭选项卡(js源码)

    1. **定义插件类**:首先,你需要定义一个新的EXTJS 类,继承自`Ext.AbstractPlugin` 或 `Ext.util.Plugin`,这将是你的插件基类。 2. **初始化插件**:在构造函数中,你可以设置插件的相关配置,并通过`init` 方法...

    手工打造Extjs (1) 类系统

    《手工打造Extjs (1) 类系统》这篇文章主要探讨了如何构建Extjs的类系统,这是一个关键的概念在JavaScript库的开发中,特别是对于Extjs这样的框架。Extjs是一款基于JavaScript的UI组件库,它提供了丰富的界面组件...

    Extjs_htmleditor插件

    3. **扩展功能**:利用ExtJS的可扩展性,开发自定义插件以满足特殊需求,如Markdown转换、LaTeX公式编辑等。 4. **性能优化**:根据实际场景调整编辑器的更新频率,减少不必要的DOM操作,提高应用性能。 总之,...

    ExtjS--accordion布局

    ExtJS 是一个强大的JavaScript 库,专用于构建富客户端Web应用程序。它提供了丰富的组件和布局管理功能,使得开发者能够创建复杂、交互式的用户界面。在本篇博客中,我们将聚焦于"accordion布局"这一特性,它是ExtJS...

    解决Extjs当中复选框全选后,取消选中某一项,全选框仍是选中状态的问题

    在EXTJS这个强大的JavaScript框架中,用户界面的交互设计是其一大亮点,其中包括各种各样的控件,如复选框(checkboxes)和全选功能。然而,在实际应用中,我们可能会遇到一个问题:当实现全选功能后,如果尝试取消...

    extjs对ajax的支持文档

    在ExtJS中,Ajax支持是核心功能之一,它使得在浏览器端与服务器进行异步通信成为可能,无需刷新整个页面。以下是对Ajax支持的详细说明: 1. **Ajax基础**: - Ext.Ajax是ExtJS中的核心模块,用于处理所有与Ajax...

    extjs4 导航菜单实例

    在ExtJS中,导航菜单通常通过`Ext.menu.Menu`类来实现,这是一个可弹出的菜单,可以包含多个子菜单项。创建导航菜单时,我们需要定义菜单项(menu items),每个菜单项可以是简单的链接、复选框、分割线或包含子菜单...

    extjs实现用户登录界面

    ExtJS 是一个流行的JavaScript框架,用于构建富客户端的Web应用程序。它提供了丰富的组件库,用于创建复杂的用户界面。在“extjs实现用户登录界面”这个主题中,我们将深入探讨如何利用ExtJS创建一个功能完善的登录...

Global site tag (gtag.js) - Google Analytics