一.什么是闭包?

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

    原文网址:https://segmentfault.com/q/1010000004048449 比如一个数组$a=array("a"=>"1",&quo ...

  2. VC++6.0在Win7以上系统上Open或Add to Project files崩溃问题 解决新办法

    崩溃原因是和office高版本冲突,比如我64位win7装了64位office2013及visio就遇到了这个问题(我很纳闷,记得重装系统前装的是32位office2013及visio就未曾遇到该问题 ...

  3. 使用异步js解决模态窗口切换的办法

    核心代码 js ="setTimeout(function(){document.getElementsByTagName('Button')[3].click()},100);" ...

  4. MySQL Workbench 6 不能删除数据等问题（“Error Code: 1175”） 和入门教程

    网络资料收集 当用MySQL Workbench进行数据库的批量更新时,执行一个语句会碰到以下错误提示: Error Code: 1175 You are using safe...without a ...

  5. ace_admin_1.3.1 wysiwyg 工具条下拉出不来

    试了很久才知道是因为<script src="__PUBLIC__/assets/js/bootstrap.min.js"></script>  这个js加 ...

  6. 使用R进行倾向得分匹配

    pacman::p_load(knitr, wakefield, MatchIt, tableone, captioner)set.seed(1234)library(wakefield)df.pat ...

  7. php的rss订阅

    一般来说我们很少自己造轮子,读取rss还是用git上的开源库吧 https://github.com/dg/rss-php 这个开源库不能读取博客园的rss订阅,新浪微博的格式显示有问题. 博客园的订 ...

  8. spring主要的作用？

    在SSH框假中spring充当了管理容器的角色.我们都知道Hibernate用来做持久层,因为它将JDBC做了一个良好的封装,程序员在与数据库进行交互时可以不用书写大量的SQL语句.Struts是用来 ...

  9. Android系统架构-----Android的系统体系架构

    一.Android的系统体系结构 在入门了一个简单的Android的Hello World以后,我们首先来看一下我们Android的整体系统架构图: 这个就是我们Android的整体系统架构图了,我们 ...

  10. android定义启动唯一apk

    <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="ht ...