一.什么是闭包?

概念性的我就不去百度了，感兴趣的可以自己去搜下,我自己的理解，闭包就是一个封装的包，相当于类的概念，把乱七八糟的的东西封装到一起，然后统一使用一个对象来调用，实现代码部分对外开放，部分隐藏的作用，就比如很多好用的js jquery 插件，为什么一行代码就可以使用了？ 因为往往我们不会去关心实现，而只想知道怎么用，本文仅仅对于这个概念做一个简单的阐述，有兴趣的可以自己自由发挥。 0.0

代码如下:

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <script type="text/javascript" src="js/jquery-1.11.0.js" ></script>

        <script type="text/javascript">

             (function(){

                 //这个一个空的闭包

             })();

        </script>

        <title></title>

    </head>

    <body>

    </body>

</html>

简单的用法如下:

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <script type="text/javascript" src="js/jquery-1.11.0.js" ></script>

        <script type="text/javascript">

             (function(){

                 //自定义方法

                 var showMessage=function(para){

                     alert(para)

                 };

                 var write=function(){

                     $("body").append("111111");

                 };

                //返回一个可供调用的对象

               return  window.NewObj={

                     show:showMessage,

                     writeHtml:write

               };

             })();

             $(function(){

                   NewObj.show("调用了闭包中的方法");

             });

        </script>

        <title></title>

    </head>

    <body>

    </body>

</html>

这样就完成了一个简单闭包的封装，那么把它放到对应的js文件，就可以做成一个公共的js 来使用了

如下：

             /*ToolHelper

 * 对象定义内容如下

 * AsyncAjax ajax  异步请求

 * CommonAjax ajax 同步请求

 * SetCookie 创建cookie

 * GetCookie 读取cookie

 * DelCookie 删除cookie

 */

(function(){

    var asyncAjax=function(url,para,callback,options){

        $.ajax({

             url:url,

             data:para,

             dataType:"json",

             success:function(data){

                 console.log(JSON.stringify(data[0]));

                  callback(data,options);

            }

        });

    };

    var commonAjax=function(url,para,callback,options){

        $.ajax({

             url:url,

             data:para,

             type:"GET",

             async:false,

             dataType: "json",

             success:function(data){

                 console.log(JSON.stringify(data[0]));

                  callback(data,options);

            }

        });

    };

    var writeCookie = function(key,value) {

        //html5 本地存储，这个为内置方法

        localStorage.setItem(key,value);

    };

    var getCookie = function(key) {

        //html5 本地存储，这个为内置方法

      return localStorage.getItem(key);

    }

    var delCookie=function(key){

        localStorage.removeItem(key);

    };

    var getQueryStr = function(name) {

        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");

        var r = location.search.substr(1).match(reg);

        if (r != null) return unescape(decodeURI(r[2]));

        return null;

    };

    return ToolHelper={

         AsyncAjax:asyncAjax,

         CommonAjax:commonAjax,

         SetCookie:writeCookie,

         GetCookie:getCookie,

         DelCookie:delCookie,

         GetQueryString:getQueryStr

    };

})();

//可以看到文中定义了一个工具对象，封装了一些简单的方法，个人认为ajax  不需要封装什么东西，直接调用即可。

Jquery和Javascript 实际项目中写法基础-闭包 (2)的更多相关文章

  1. Jquery和Javascript 实际项目中写法基础-弹出窗和弹出层 (4)

     一.实际项目中有很多如下界面效果.    二.该效果可以归结为弹出窗或者弹出层来实现的,为什么这么说?看如下代码:      <!DOCTYPE html> <html> & ...

  2. Jquery和Javascript 实际项目中写法基础 (1)

    一.JS 是什么,jquery 是什么  就不说明了,直接说一般使用是怎么样的 <!DOCTYPE html> <html> <head> <meta cha ...

  3. Jquery和Javascript 实际项目中写法基础-ajax和json (3)

    一.什么是JSON数据? 一种轻量级的数据交换格式.实际中知道如何使用即可. 软件开发我认为就是一个会用,然后知其原理的过程. 例子如下: <!DOCTYPE html> <html ...

  4. JavaScript在HTML中的基础用法总结

    网页主要由三部分组成,分别为html.CSS和Javascript.如果说HTML是肉身,CSS是皮相,那Javascript就是灵魂.因此,三者的联系与融合则至关重要.本文就来为大家讲解一下Java ...

  5. ASP.NET MVC jQuery 树插件在项目中使用方法（一）

    jsTree是一个 基于jQuery的Tree控件.支持XML,JSON,Html三种数据源.提供创建,重命名,移动,删除,拖"放节点操作.可以自己自定义创建,删 除,嵌套,重命名,选择节点 ...

  6. JQuery统一复写美化项目中所有radio单选按钮样式

    老项目要升级改版,对于分散在各页面的样式不好处理,怕有遗漏,尤其是优化input表单,修改其默认样式,接下来,我将给大家分享一下,我在项目中的总结. 效果 上代码: 1.简单搞一搞 CSS,此处代码有 ...

  7. 项目中lua(基础)

    关于项目中lua任务(某些没弄懂,但lua上耗费时间有点长了不看了) 这段时间看了lua语法和项目中lua应用 .在lua中注册c库,在lua5.2中好像都是注册c库,相当于在lua中定义一个tabl ...

  8. jQuery Validate验证（项目中使用的）

    大致结构是: <script type="text/javascript" src="<%=path %>/js/jquery-1.9.1.min.js ...

  9. NopCommerce开源项目中很基础但是很实用的C# Helper方法

    刚过了个五一,在杭州到处看房子,不知道杭州最近怎么了,杭州买房的人这么多,房价涨得太厉害,这几年翻倍翻倍地涨,刚过G20,又要亚运会,让我这样的刚需用户买不起,也买不到房子,搞得人心惶惶,太恐怖了,心 ...

随机推荐

  1. 删除DSO Change Log表数据

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  2. 数据转换为json格式的方法

    数据转换为json格式: 如果一张表中存在主外键关系,模板自动生成的类是不可以转换成JSON格式的,此时需要重新写一个类,类前面需加[DataContract],字段前需加[DataMember],实 ...

  3. 跨站脚本 XSS<一：介绍>

    *XSS 利用的是用户对指定网站的信任,CSRF 利用的是网站对用户网页浏览器的信任 跨站脚本(Cross-site scripting,通常简称为XSS)是一种网站应用程序的安全漏洞攻击,是代码注入 ...

  4. do while(false)实用技巧

    今天看项目源码的时候发现有些地方用了do{} while(false)的用法,查了下发现这样确实有些优点,mark下. 1.最重要的优点,用在略微复杂的宏定义中. #define AB1 a; b; ...

  5. 用spring的InitializingBean作初始化

    org.springframework.beans.factory包下有一个接口是InitializingBean 只有一个方法: /**  * Invoked by a BeanFactory af ...

  6. ERWin 7.2下载安装及注册机

    ERWin 7.2下载安装及注册机   ERWin 7.2 下载地址: ftp://ftp.ca.com/CAproducts/erwin/ServicePacks/AFEDM72-b1644.exe ...

  7. link和@import的区别

    link属于XHTML标签,而@import完全是css提供的一种方式:标签和css样式的区别就不说了,他们起到的作用区别不大,一般建议用link因为简单,@import会对页面载入有影响,影响性能l ...

  8. linux 真·随笔

    复制操作 命令行模式下输入 6,9 co 12 复制第6行到第9行之间的内容到第12行后面. vim如何删除文件中所有东西 ggdG :%d 移动光标到指定行的行尾 $:移动光标到行尾 n$:移动到第 ...

  9. python 安装模块步骤

    1.下载 pyocr-0.4.1.tar.gz   tar.gz文件  解压  放到 c:/python27 文件夹下面 C:\Python27\pyocr-0.4.1  直接 cmd 命令 进入   ...

  10. javascript错误处理与调试（转）

    JavaScript 在错误处理调试上一直是它的软肋,如果脚本出错,给出的提示经常也让人摸不着头脑. ECMAScript 第 3 版为了解决这个问题引入了 try...catch 和 throw 语 ...