javascript 闭包详解


Posted in Javascript onFebruary 15, 2015

javascript 闭包是一个很有趣的东东。看了些相关资料https://3water.com/article/29472.htm,对其印象最深刻的是:实现了public 和private。

创建一个非匿名闭包最简单的语法是:

var obj = (function(){//各种代码  });

闭包最经典的例子:

var makeCounter = (function () {

        var i = 1; 

        this.test=function(){ 

            console.log(i);

            i++; 

        }

        return this;

    });

    var obj = makeCounter();

    obj.test(); // 1

    obj.test(); // 2

    var obj1 = makeCounter();

    obj1.test(); // 1

    obj1.test(); // 2

private 与 public :

var makeCounter= (function () {

        var i = 1;

        //这货是private的

        function log(){

            console.log(i);

            i++;

        }

        //这货是public的

        this.test(){

            log();

        }

        return this;

    });

    var obj = makeCounter();

    obj.test(); // 1

    obj.test(); // 2 

    obj.log(); //undefined   

自执行函数:

第一次看到这样的代码时的感觉是:好高级;

var obj = (function(window){

      //各种代码

}(window));

然后google了下,发现他们经常都会这样写:

var obj= (function () {

        var i = 1; 

        this.test=function(){ 

            console.log(i);

            i++; 

        }

        return this;

    }());

    obj.test(); // 1

    obj.test(); // 2

     最简单的理解,程序员偷懒把两步写成了一步。

    //这是一个函数。它应该这样用obj()

    var makeCounter = function () {

        //各种代码 

    }

    //这是一个对象。它类似于 var obj = makeCounter();

    var obj = (function () {

        //各种代码

    }());

它也可以有参数:

    var output = "new test";

    var obj = (function (msg) {

        this.test = function(){

            console.log(msg);

        }

        return this;

    }(output));

    obj.test();

它还可以更复杂更高级点:

var output = "new test";

    var obj = (function (obj, msg) {

        //这货也是私有的。类似obj.i(!=obj.i),却又不是obj.i(因为外部不可访问)。

        var i = 1;

        //private

        function log() {

            console.log(i + " : " + msg);

            i++;

        }

        //public

        obj.test = function () {

            log();

        }

        return obj;

    }(obj, output));

    obj.test(); // 1 : new test

    obj.i = 100;

    //i没被改变

    obj.test(); // 2 : new test

初次见面,留下了很深刻的印象。闭包的使用,实现了状态,属性的保持;避免了全局变量满屏飞舞;结束了变量老是被重定义,重赋值的尴尬局面。它还可以将一个对象分部到多个js文件。实在是太好了。

上面所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
JQuery EasyUI 加载两次url的原因分析及解决方案
Aug 18 Javascript
jQuery中:nth-child选择器用法实例
Dec 31 Javascript
JavaScript编写推箱子游戏
Jul 07 Javascript
微信支付如何实现内置浏览器的H5页面支付
Sep 25 Javascript
深入解析JavaScript框架Backbone.js中的事件机制
Feb 14 Javascript
jQuery.form.js插件不能解决连接超时(timeout)的原因分析及解决方法
Oct 14 Javascript
javascript简单进制转换实现方法
Nov 24 Javascript
如何在Angular.JS中接收并下载PDF
Nov 26 Javascript
关于Vue.js 2.0的Vuex 2.0 你需要更新的知识库
Nov 30 Javascript
js实现图片上传预览原理分析
Jul 13 Javascript
Vue实现简易翻页效果源码分享
Nov 08 Javascript
使用Karma做vue组件单元测试的实现
Jan 16 Javascript
PhotoShop给图片自动添加边框及EXIF信息的JS脚本
Feb 15 #Javascript
浅析javascript中函数声明和函数表达式的区别
Feb 15 #Javascript
不同编码的页面表单数据乱码问题解决方法
Feb 15 #Javascript
浅谈javascript中this在事件中的应用
Feb 15 #Javascript
javascript使用正则表达式实现去掉空格之后的字符
Feb 15 #Javascript
分享一个自己写的简单的javascript分页组件
Feb 15 #Javascript
Linux下编译安装php libevent扩展实例
Feb 14 #Javascript
You might like
PHP Pear 安装及使用
2009/03/19 PHP
PHP数据库万能引擎类adodb配置使用以及实例集锦
2014/06/12 PHP
Yii2.0实现的批量更新及批量插入功能示例
2019/01/29 PHP
关于文本限制字数的js代码
2007/04/02 Javascript
仅IE6/7/8中innerHTML返回值忽略英文空格的问题
2011/04/07 Javascript
jquery如何通过name名称获取当前name的value值
2013/12/20 Javascript
页面元素绑定jquery toggle后元素隐藏的解决方法
2014/03/27 Javascript
与Math.pow 相反的函数使用介绍
2014/08/04 Javascript
提交按钮的name='submit'引起的js失效问题及原因
2015/02/25 Javascript
jquery实现表格隔行换色效果
2015/11/19 Javascript
JavaScript日期选择功能示例
2017/01/16 Javascript
在javaScript中检测数据类型的几种方式小结
2017/03/04 Javascript
JS实现获取图片大小和预览的方法完整实例【兼容IE和其它浏览器】
2017/04/24 Javascript
webpack教程之webpack.config.js配置文件
2017/07/05 Javascript
浅谈Vuejs Prop基本用法
2017/08/17 Javascript
VUE 项目在IE11白屏报错 SCRIPT1002: 语法错误的解决
2020/09/27 Javascript
[01:37]全新的一集《真视界》——TI7总决赛
2017/09/21 DOTA
wxPython事件驱动实例详解
2014/09/28 Python
Python实现周期性抓取网页内容的方法
2015/11/04 Python
Python中的id()函数指的什么
2017/10/17 Python
python3使用scrapy生成csv文件代码示例
2017/12/28 Python
Python实现的径向基(RBF)神经网络示例
2018/02/06 Python
Python实现手写一个类似django的web框架示例
2018/07/20 Python
Pycharm2017版本设置启动时默认自动打开项目的方法
2018/10/29 Python
对python:print打印时加u的含义详解
2018/12/15 Python
python selenium实现发送带附件的邮件代码实例
2019/12/10 Python
Python求平面内点到直线距离的实现
2020/01/19 Python
Abe’s of Maine:自1979以来销售相机和电子产品
2016/11/21 全球购物
LTD Commodities:礼品,独特发现,家居装饰,家用器皿
2017/08/11 全球购物
请编写一个 C 函数,该函数在给定的内存区域搜索给定的字符,并返回该字符所在位置索引值
2014/09/15 面试题
中西医结合临床医学专业大学生自荐信
2013/09/28 职场文书
学校经典推荐信
2013/10/30 职场文书
天猫活动策划方案
2014/08/21 职场文书
辛亥革命观后感
2015/06/02 职场文书
幼儿园亲子活动感想
2015/08/07 职场文书
浅谈:电影《孔子》观后感(范文)
2019/10/14 职场文书