美文网首页我爱编程
【Javascript】匿名函数

【Javascript】匿名函数

作者: 嘻洋洋 | 来源:发表于2018-07-25 14:00 被阅读0次

    1匿名函数定义

    function(arg){....},var sayHi = function(){alert(ok)};

    2匿名函数调用

    定义了一个参数为arg的匿名函数,并且将param作为参数来调用这个匿名函数。
    (function(arg){....})(param) 调用函数时,由于操作符的优先级,函数本身也需要用括号(或者其它),然后在函数后面写上括号和实参
    举例:(function(){…})(jQuery)则是一样的,之所以只在形参使用,是为了不与其他库冲突,所以实参用jQuery

    (function(a){
       console.log(a);   //firebug输出123,使用()运算符
    })(123);
    

    执行匿名函数的方法除了括号(Jquery插件中常见),function前面加!、+、 -甚至是逗号等到都可以起到函数定义后立即执行的效果

    !function(a){
       console.log(a);   //firebug输出12345,使用!运算符
    }(12345);
    

    3匿名函数的运用场景

    用匿名函数作为一个“容器”,“容器”内部可以访问外部的变量,而外部环境不能访问“容器”内部的变量,所以( function(){…} )()内部定义的变量不会和外部的变量发生冲突,俗称“匿名包裹器”或“命名空间”。
    JQuery使用的就是这种方法,将JQuery代码包裹在( function (window,undefined){…jquery代码…} (window)中,在全局作用域中调用JQuery代码时,可以达到保护JQuery内部变量的作用。
    重点:JQuery的插件就是用此法定义一些需要预先定义好的函数

    4 Jquery(zepto)插件扩展解析

    • cookie扩展:zepto.cookie.js
    ;(function($){
         $.cookie = function (key, value, options) {...}
    })(Zepto);
    
    • 倒计时扩展:jquery.countdown.js
    (function($){
        var main = function()
        {
            var args = arguments;
            var config = {sessionStorageNm:'',attribute : 'data-seconds', callback : null };
            if(args.length == 1)
            {
                if(typeof(args[0]) == "function") config.callback = args[0];
                if(typeof(args[0]) == "object") $.extend(config, args[0]);
            }else{
                config.attribute = args[0]; //秒数:后台数据
                config.callback = args[1]; //回调函数
                config.sessionStorageNm = args[2];//localsrage保存离开时间:变量
            }
            $(this).each(function(index, item){
                countdown.call(item, item, config);
            });
        };
        $.fn.countdown = main;
    })(jQuery);
    

    补充Jquery方法的拓展。

    • 类似java的静态方法(使用$)
    $.test = function(a,b) {
        return a+b;
    };
    或者
    $.extend({
        test:function(a,b) {
           return a+b;
        }
    });
    调用: alert($.test(4,4));
    
    • 实例方法($.fn)
    $.fn.test = function() {
      return $(this).val();
    };
     或者
    $.fn.extend({ 
     test:function() {
       return $(this).val();
    }
    });  
    调用:  alert($("#name").test()); 必须由“对象”$("")来调用
    

    相关文章

      网友评论

        本文标题:【Javascript】匿名函数

        本文链接:https://www.haomeiwen.com/subject/picpmftx.html