美文网首页
Javascript基础进阶(五) 闭包

Javascript基础进阶(五) 闭包

作者: js_冠荣 | 来源:发表于2018-08-01 20:25 被阅读0次

闭包

什么是闭包?

闭包是一种机制,函数执行的时候形成一个新的私有的作用域保护了里面的私有变量不受外界的干扰(外面无法修改里面,里面无法改变外面),这种保护机制是闭包。

闭包能解决什么问题?

闭包可以解决函数外部无法访问函数内部变量的问题。

接下来咱们就以案例的形式一步一步看闭包。

function fn(){
   var num = 10;
}; 
alert(num);

运行代码发现报错了,因为num没有定义,虽然函数fn里面定义了num但是,但是它只能在函数fn中使用。也就是作用域的问题。

function fn(){
    //定义了一个变量name
  var num = 20;
    //我现在想在外部访问这个变量num怎么办?不是有return,我把它返回出去,我再用个变量接收一下不就可以了.
    return num;
}
var num= fn();//接收fn返回的num值。
alert(num);// 20;

这里的闭包就是利用函数的return。声明一个变量在外部接受。就可以访问到函数内部变量。

闭包有一个最大的特点就是通过闭包我们可以让函数中的变量持久保持。
function fn(){
    var num = 0;
    return function(){
        num+=1;
          alert(num);
      };  
}
var f = fn();
f(); //1
f(); //2

这段代码很简单,不要被它欺骗了,我们首页定义了一个fn函数,里面有个num默认为0,接着返回了一个匿名函数(也就是没有名字的函数)。我们在外部用f接收这个返回的函数。这个匿名函数干的事情就是把num加1,还有我们用来调试的alert。

这里之所以执行玩这个函数num没有被销毁是因为那个匿名函数的问题,因为这个匿名函数用到了这个num,所以没有被销毁,一直保持在内存中,因此我们f()时num可以一直加。

如果你觉得没什么,请看下面这个例子:

function fn(){
    var num = 5;
    num+=1;
    alert(num);
};
fn(); //6
fn(); //6

因为函数一旦调用里面的内容就会被销毁,下一次调用又是一个新的函数,和上一个调用的不相关了

觉得写的不错的小伙伴点赞加关注哦! (=・ω・=)

相关文章

  • 技术栈

    一、HTML、CSS基础、JavaScript语法基础。 二、JavaScript语法进阶。包括:作用域和闭包、t...

  • 2020前端技术栈

    一、HTML、CSS基础、JavaScript语法基础。二、JavaScript语法进阶。包括:作用域和闭包、th...

  • Javascript基础进阶(五) 闭包

    闭包 什么是闭包? 闭包是一种机制,函数执行的时候形成一个新的私有的作用域保护了里面的私有变量不受外界的干扰(外面...

  • JavaScript 闭包---基础+进阶

    前言 这篇文章使用有效的javascript代码向程序员们解释了闭包,大牛和功能型程序员请自行忽略。 基础篇 闭包...

  • Javascript 基础 And 进阶

    Javascript 基础 And 进阶 知识点: 原型链 this指向 作用域和预解析 new关键字 闭包 DO...

  • JavaScript: 零基础轻松学闭包

    JavaScript: 零基础轻松学闭包 参考链接 JavaScript: 零基础轻松学闭包(1)http://w...

  • Javascript基础--闭包

    写在前面 闭包是JavaScript中一个重要的概念,本文使用3w(what,why,how)原则总结一下闭包这个...

  • [JavaScript基础] 闭包

    闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。总而言之,...

  • JavaScript基础 闭包

    回收机制 一个变量或函数执行完后,下面的代码没有在使用或调用时会被回收回去,释放出内存。定义一个变量、函数会在内存...

  • 深入JS闭包和应用场景

    看过很多的关于闭包的讲解,写个进阶总结吧。 闭包在《JavaScript权威指南》定义是:函数对象本身和这个函数关...

网友评论

      本文标题:Javascript基础进阶(五) 闭包

      本文链接:https://www.haomeiwen.com/subject/qzixvftx.html