• JavaScript中的闭包


    什么是闭包?

    当一个函数在不是它所创建的环境里调用时,它就是闭包。对,闭包是函数,一个独立的函数。

    闭包的特点:

    闭包会记住它所创建的环境。

    刘道成的博客:

    写给女友的JS教程---之JS闭包

    女朋友"胖子"正在学JS, 到闭包这一块遇到了一些障碍.

    我在网上帮她找了一些文章,但又写的又枯燥又长,我来写一篇简单点的吧.


    从一次穿越说起-----

    有姐妹俩,大桃花和小桃花相继出生,

    有一次小桃花在河边洗衣服,出现奇特星像--十字连珠,小桃花穿越到了清朝.

    还进宫见到了四阿哥,身边有一群宫女,和小桃花妹相称.


    四阿哥问:"小桃花,你的姐姐是谁?"

    小桃花怎么答?   这牵涉到一个问题----

    人穿越后,对其亲人的计算,以"出生"时的环境为准,还是"当前问她"时的环境为准?


    如果你回答:"以当前问她是为准",那你是"卖姐求荣"啊.大笑

    如果你回答:"以她出生时为准,即回答大桃花" ----,恭喜你,你已理解了闭包.


    闭包即 函数定义时,连同其定义环境的上下文,形成一个整体. 

    不管该函数在哪儿运行,其对变量的访问,都要从定义处开始寻找.

    例子1: 看你理解了没

     1 function closure() {
     2     var sister = '大桃花';
     3 
     4     var mysister = function() {  
     5         return sister;
     6     }
     7 
     8     return mysister;   // 这个函数出生时,有一个sister 叫大桃花
     9 }
    10 
    11 
    12 function place() {  // 大清宫殿内
    13 
    14     var sister = '大福晋';
    15     var mysister = closure(); // 调用closure,mysister函数穿越到宫内 
    16 
    17     alert(mysister());
    18 
    19 }

    例子二: 再复杂一点,来个闭包计数器

    如果你准备在页面内建一个"统一id号生成器",

    比如为各种事件句柄,或者事件调用统一分配不重复的id,

    (jquery里就有类似的应用).

    ---如何来做呢?


    你可能说:"好办,弄个全局变量,叫count, 每次都把+1", 

    全局变量可以做到,但是这种做法不够优雅,造成全局变量污染.

    更坏的是这个变量,容易被别人(不小心)定义的同名全局变量给覆盖了.快哭了


    怎么办? 用闭包!

     1 // 闭包计数器
     2 var counter = (function() {
     3     var cnt = 0;   
     4     return (function () {  // cnt和返回函数是一个闭包,
     5         return ++cnt;      // 除了这个函数,谁也别想影响cnt :) 
     6     });  // 返回一个匿名函数
     7 })();   //立即执行匿名函数,返回值是一个函数,该函数赋给counter
     8 
     9 alert(counter()); // 1
    10 alert(counter()); // 2
    11 alert(counter()); // 3

    在上面的例子中, 

    1:除了counter()函数,其他语句对于cnt都够不着,摸不到.

    2: 匿名函数执行后,给人的感觉是----函数内的局部变量 cnt应该消失才对,

    实际上没有消失----被返回的函数所捕捉,形成了一个"环境变量+函数"的包,

    外界又打不进去, 所以叫闭包啊.大笑

    例子三: 如何在JS的面向对象应用中,写一个私有属性?

    你已经猜到了,还是用闭包.

     1 // 闭包示爱器---JS面向对象之私有属性问题
     2 
     3 function girl() {
     4     
     5     var love = '宝玉';  // 这是变量
     6     
     7     this.age = 19;      // 这是属性,注意对比.
     8 
     9     this.showlove = function() {
    10         return love;
    11     }
    12 }
    13 
    14 var lindaiyu = new girl();
    15 
    16 // 想一想,在外界,谁能访问到黛玉的"age"?
    17 // 大家都可以
    18 
    19 alert(lindaiyu.age); // 19;
    20 
    21 // 再想,谁能在外界访问到黛玉的"love"
    22 // 谁也别想,除非黛玉的showlove()公有方法才能访问该值
    23 alert(lindaiyu.showlove());

    待续。。。

  • 相关阅读:
    assign、weak
    iOS 使用 github
    iOS 知识点
    thinkphp 具体常量,在view里面使用
    一个php+jquery+json+ajax实例
    php pdo操作
    nginx缓存
    php模版静态化技术
    php模版静态化原理
    thinkphp实现多数据库操作
  • 原文地址:https://www.cnblogs.com/arvintang/p/5640464.html
Copyright © 2020-2023  润新知