初识js中的闭包_Js闭包中变量理解

初识js中的闭包_Js闭包中变量理解今天看了关于js闭包方面的文章,还是有些云里雾里,对于一个菜鸟来说,学习闭包确实有一定的难度,不说别的,能够在网上找到一篇优秀的是那样的不易。当然之所以闭包难理解,个人觉得是基础知识掌握的不牢,因为

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

  今天看了关于js闭包方面的文章,还是有些云里雾里,对于一个菜鸟来说,学习闭包确实有一定的难度,不说别的,能够在网上找到一篇优秀的是那样的不易。

  当然之所以闭包难理解,个人觉得是基础知识掌握的不牢,因为闭包牵扯到一些前面的东西,比如作用域\等等,如果连基本的作用域都没有弄清楚,自然不可能搞懂闭包,还有就是对js的实践比较少,因为你根本就不知道什么时候要用这东西,自然谈不上对闭包的深刻理解。

  今天我就简单的说说我目前所理解的闭包,当然可能不完全正确,但是我相信会给你一定的启发。

 

  首先我们来谈谈js中的变量,如果你不知道我为什么要说这些,那么你根本没有掌握js的基础,建议回头复习。

js中分:全局变量 和 局部变量

  全局变量:可以在任意位置访问的量就叫全局变量

    

1 var age = 20; 2 function a(){ 3 console.log(age); >>20 4 } 5 a();

  局部变量:函数中用var定义的变量,只能在函数中访问这个变量,函数外部访问不了。

1 function a(){ 2 var age = 20; 3 } 4 a(); 5 console.log(age); >> Uncaught ReferenceError: age is not defined

 

注意点1:在函数中如果不使用var定义变量那么js引擎会自动添加成全局变量。

注意点2:全局变量从创建的那一刻起就会一直保存在内存中,除非你关闭这个页面,局部变量当函数运行完以后就会销毁这个变量,假如有多次调用这个函数它下一次调用的时候又会重新创建那个变量,既运行完就销毁,回到最初的状态,简单来说局部变量是一次性的,用完就扔,下次要我再重新创建。

 

函数的相关知识点:

        1. 一个函数内可以嵌套多个函数

    2. 函数里面的子函数可以访问它上级定义的变量,注意不只是一级,如果上级没有会继续往上级找,直到找到为止,如果找到全局变量到找不到就会报错。

     

1 function a(){ 2 var name = "追梦子"; 3 function b(){ 4 console.log(name); >> "追梦子" 5 } 6 b(); 7 } 8 a();

    3. 函数的另外一种调用形式,你可以把它叫做自调用,自己调用自己,达到自执行的效果。

   

1 var a = 0; 2 (function(){ 3 console.log(++a); >>1 4 })()

这种方式用()把内容包裹起来,后面的()表示执行这个函数,可能你会问为什么要把函数包起来,如果不包裹起来,js会把它当作函数声明来处理,如果包裹起来就是表达式,还没有看懂就上网查吧。

 

 

开始我们正式闭包部分—————————- 币包 —————像钱包一样的东西,可以把东西包裹起来———-

      首先我们来看看为什么需要学习闭包,加以理解 — 0 v  0- –

 

1 function a(){ 2 var num = 0; 3 console.log(++num); 4 } 5 a(); >>1 6 a(); >>1

上面代码输出了两次1,为什么呢?如果你有看我上面的关于变量部分肯定能够想到个大概。

  前面我们说过了函数执行完以后,里面的变量(即局部变量)就会销毁,下一次运行又会重新创建那个变量,所以虽然你第一次++num了但是这个变量在第一次执行完毕以后就被销毁了。

那么我们怎么样才能确保第一次的变量不被销毁,那么就需要我们的闭包出场了。

温馨提示:JavaScript中有回收机制,函数没有被引用执行完以后这个函数的作用域就会被销毁,如果一个函数被其他变量引用,这个函数的作用域将不会被销毁,(简单来说就是函数里面的变量会被保存下来,你可以理解成全局变量。)

…………………………………………………………………………………… 当 当 当 …………….. 下面有请我们的币包同志

 

function a(){ var aa = 0; function b(){ aa ++; console.log(aa); } return b; } var ab = a(); ab(); //1 ab(); //2

看到了吧里面的变量的值没有被销毁,因为函数a被外部的变量ab引用,所以变量aa没有被回收。

     如果某个函数被它的父函数之外的一个变量引用,就形成了一个闭包

还有一种更为常用的闭包写法

var bi = (function(){ var a = 0; function b(){ a ++; console.log(a); } return b; })(); bi(); //1 bi(); //2 bi(); //3

执行过程分析:

  首先把一个自执行函数赋值给了bi,这个自执行函数运行完成以后就bi的值就变成了

function b(){
    a ++;
    console.log(a);
}

  因为我们在上面的代码return回去了b,然后因为这个自执行函数被bi引用所以里面的变量a并没有因为这个自执行函数执完而销毁,而是保存到了内存中,所以我们多次打印bi()就成了1、2、3

 

下面我来说一个闭包的使用场景吧。

   没有使用闭包的版本

window.onload = function(){ var ul = document.getElementsByTagName("ul")[0]; var li = ul.getElementsByTagName("li"); for(var i=0;i<li.length;i++){ li[i].onclick = function(){ console.log(i); //不管我怎么点都是返回6
 } } }

  使用了闭包的版本

window.onload = function(){ var ul = document.getElementsByTagName("ul")[0]; var li = ul.getElementsByTagName("li"); for(var i=0;i<li.length;i++){ (function(i){ li[i].onclick = function(){ console.log(i); //点击第几个返回第几个
 } })(i) } }

、、、、、如果你不理解这个,你只要这样子用就能够达到效果。

 

这也只是简单的介绍了一下,后面将会在闭包的高级部分讲解。如果你对闭包有更深的理解可以pm我。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/166391.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • mac idea2021.4.3 激活码(破解版激活)

    mac idea2021.4.3 激活码(破解版激活),https://javaforall.cn/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

  • 详解RPN网络[通俗易懂]

    详解RPN网络[通俗易懂]引言RPN(RegionProposalNetwork)是Faster-RCNN网络用于提取预选框(也就是RCNN中使用selectivesearch算法进行RegionProposal的部分),我们知道RCNN及Fast-RCNN中一个性能瓶颈就是提取预选框的部分,而RPN很好地对这个部分进行了优化,原因在于它将卷积神经网络引入了进来,使用特征提取的形式生成出预选框的位置从而降低了selectivesearch算法带来的计算时间上的开销。RPN(RegionProposalNetwor

  • 我说我不会算法,阿里把我挂了。[通俗易懂]

    我说我不会算法,阿里把我挂了。[通俗易懂]不说了,字节跳动也反手把我挂了。

  • DFS(深度优先搜索算法)「建议收藏」

    DFS(深度优先搜索算法)「建议收藏」基本概念深度优先搜索算法(DepthFirstSearch,简称DFS):一种用于遍历或搜索树或图的算法。沿着树的深度遍历树的节点,尽可能深的搜索树的分支。当节点v的所在边都己被探寻过或者在搜寻时结点不满足条件,搜索将回溯到发现节点v的那条边的起始节点。整个进程反复进行直到所有节点都被访问为止。属于盲目搜索,最糟糕的情况算法时间复杂度为O(!n)。算法思想回溯法(探索与回溯法…

  • sublime插件anaconda的设置[通俗易懂]

    sublime插件anaconda的设置[通俗易懂]Anaconda插件配置

  • Redis 4.x/5.x IDOR漏洞复现[通俗易懂]

    Redis 4.x/5.x IDOR漏洞复现[通俗易懂]Redis4.x/5.x未授权访问漏洞Redis未授权访问在4.x/5.0.5以前版本下,我们可以使用master/slave模式加载远程模块,通过动态链接库的方式执行任意命令。漏洞复现最近碰到ctf的题目是通过ssrf和redis的未授权访问打入内网getshell,想着用docker复现以下此漏洞。拉取环境开启环境后,如图使用redis-cli-hyour-ipj即可连接redis数据库,并且可以清空所有数据,即有未授权访问漏洞使用poc实现远程命令执行先将下载好的poc目录下

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号