一.什么是闭包?

概念性的我就不去百度了，感兴趣的可以自己去搜下,我自己的理解，闭包就是一个封装的包，相当于类的概念，把乱七八糟的的东西封装到一起，然后统一使用一个对象来调用，实现代码部分对外开放，部分隐藏的作用，就比如很多好用的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. Bootstrap_下拉菜单

    在使用Bootstrap框架的下拉菜单时,必须调用Bootstrap框架提供的bootstrap.js文件. 一.普通下拉菜单 <div class="dropdown"&g ...

  2. maven环境快速搭建

    ----------------准备工作------------- Jdk  1.5以上java开发环境. Eclipse IDE 一个. Maven 3.0.3下载地址: http://maven. ...

  3. php : 匿名函数(闭包) [二]

    摘自: http://www.cnblogs.com/yjf512/archive/2012/10/29/2744702.html php的闭包(Closure)也就是匿名函数.是PHP5.3引入的. ...

  4. Response.End()在Webform和ASP.NET MVC下的表现差异

    前几天在博问中看到一个问题--Response.End()后,是否停止执行?MVC与WebForm不一致.看到LZ的描述后,虽然奇怪于为何用Response.End()而不用return方式去控制流程 ...

  5. jdom xml解析

    import org.jdom.Document; import org.jdom.Element; import org.jdom.input.SAXBuilder; import org.xml. ...

  6. 【CSU1812】三角形和矩形 【半平面交】

    检验半平面交的板子. #include <stdio.h> #include <bits/stdc++.h> using namespace std; #define gg p ...

  7. 拼接字符串去掉最后多余的串，JSON的遍历

    一.遍历json change_url: function(key, value){ condition[key] = value; var string_url = "?"; f ...

  8. Python中的logging模块

    http://python.jobbole.com/86887/ 最近修改了项目里的logging相关功能,用到了python标准库里的logging模块,在此做一些记录.主要是从官方文档和stack ...

  9. ThinkPHP配置信息

    在index.php文件中设置常量: define('BIND_MODULE', 'Home'); 进行绑定默认访问的模块. 同样的,也可以在配置文件config.php中的配置数组中设置配置常量: ...

  10. （转载） PowerDesigner 生成sql文件

    Powerdesigner15-物理模型-导出建表sql语句 博客分类: Powerdesigner Powerdesigner15-物理模型-导出建表sql语句 1.设置哪种数据库导出的sql语句, ...