0

0

对于js闭包进一步理解

不言

不言

发布时间:2018-07-18 17:16:14

|

1598人浏览过

|

来源于php中文网

原创

这篇文章给大家分享的内容是关于对js闭包进一步理解,内容很不错,有需要的朋友可以参考一下。

闭包这个概念  自我几个月前开始学习JS开始  我就一直困惑

之前也有所理解  但是后来长时间不用就给忘记了

闭包:通俗的讲  大多数人所接受的就是 一个函数有权利使用另一个函数里的局部变量

我看到了很多的不同之处

用最简单的代码表示

function out(){

var age=21;

function inner(){

console.log(age);

}

return inner;

}

var fn=out();
fn(); //22

很符合概念 

我觉得闭包就是在体现作用域

inner 函数实在 out 函数里面定义地 

所以console(age);

就会变量搜索机制,首先在自己(inner)函数作用域里面找,没找到 就去out函数作用域里面找

找到了  然后输出  如果在out里面没有找到的话  会再往更大的作用域找

一直到window的作用域   下级作用域可以向上访问  上级作用域不能向下访问

作用域就是指

{  } 

而且JS没有块级作用域

for(var i=0;i

  console.log(i);// 1 2 3 4 5

}

cosole.log(i);//5

i 不会因为出了 for 循环就被销毁了

这点要注意

好了  说了一点作用域方面的知识  现在回到了闭包

闭包核心的就是return 看看代码 就知道了

我的理解就是  return 返回的是inner的函数体   还有 inner所能访问的作用域!

所以 inner 在哪里都可以访问到age 

司马诸葛
司马诸葛

基于企业知识文档,就可训练专属AI数字员工

下载

例子:

function  test(){
var age=23;
var fn=out();
fn(); //21

}

test();//21

 它得到的是 21  而不是22  因为函数体和作用域一起返回了  那么最近的作用域不就是out函数作用域喽

 test 函数里面定义了age也不可能被覆盖滴  因为存在的作用域不同

 它返回了 作用域  所以它访问的都是那个作用域里面的变量 跟你的函数现在所在的作用域无关哦

 闭包其实是一种现象   就是所有人玩DNF都在刷图卖材料赚钱  这种现象叫搬砖

 总结一句话:跟你定义函数作用域有关,跟你执行函数的作用域无关

 与this相反  this 是与定义时无关,与执行时有关  比较记忆

 所以你如果不能很好的理解闭包

 那你就可以像我这样理解 就好了 

 返回的是函数本身+和函数所能访问的作用域

举一个  大家常用的  

闭包Tab栏切换



 
  
  
  
  
  
  Document
  
 
 

  
  

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

for循环 每当执行list[i].onmouseover的时候   函数都会立即执行  传入当前的变量i 

返回一个函数  这个就是形成了闭包呗  返回函数和函数能够访问到的作用域

每当触发onmouseover的时候  都会执行 返回的那个函数

然后执行代函数里面的for循环 把所有li的className 清空

在执行list[n]  这句是最重要的  这里的n 就是定义onmouseover的时候传入的i 

因为当定义的时候 函数立即执行 把 i 传递给了匿名函数 这个 i 就在 匿名函数的作用域里面了

每个onmouseover都是保存着各自的 i

所以当触发onmouseover的时候能够让li访问到之前保存在作用域中的 i

也就实现了 点谁 谁背景颜色变化的需求

相关推荐:

对js函数的实参,形参以及闭包的理解

相关专题

更多
苹果官网入口直接访问
苹果官网入口直接访问

苹果官网直接访问入口是https://www.apple.com/cn/,该页面具备0.8秒首屏渲染、HTTP/3与Brotli加速、WebP+AVIF双格式图片、免登录浏览全参数等特性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

115

2025.12.24

拼豆图纸在线生成器
拼豆图纸在线生成器

拼豆图纸生成器有PixelBeads在线版、BeadGen和“豆图快转”;推荐通过pixelbeads.online或搜索“beadgen free online”直达官网,避开需注册的诱导页面。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

82

2025.12.24

俄罗斯搜索引擎yandex官方入口地址(最新版)
俄罗斯搜索引擎yandex官方入口地址(最新版)

Yandex官方入口网址是https://yandex.com。用户可通过网页端直连或移动端浏览器直接访问,无需登录即可使用搜索、图片、新闻、地图等全部基础功能,并支持多语种检索与静态资源精准筛选。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

546

2025.12.24

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

150

2025.12.24

php框架基础知识汇总
php框架基础知识汇总

php框架是构建web应用程序的架构,提供工具和功能,以简化开发过程。选择合适的框架取决于项目需求和技能水平。实战案例展示了使用laravel构建博客的步骤,包括安装、创建模型、定义路由、编写控制器和呈现视图。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

20

2025.12.24

Word 字间距调整方法汇总
Word 字间距调整方法汇总

本专题整合了Word字间距调整方法,阅读下面的文章了解更详细操作。

47

2025.12.24

任务管理器教程
任务管理器教程

本专题整合了任务管理器相关教程,阅读下面的文章了解更多详细操作。

7

2025.12.24

AppleID格式
AppleID格式

本专题整合了AppleID相关内容,阅读专题下面的文章了解更多详细教程。

12

2025.12.24

csgo视频观看入口合集
csgo视频观看入口合集

本专题整合了csgo观看入口合集,阅读下面的文章了知道更多入口地址。

371

2025.12.24

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
JavaScript 编程技巧与实战
JavaScript 编程技巧与实战

共103课时 | 10.8万人学习

前端进阶之JavaScript设计模式
前端进阶之JavaScript设计模式

共22课时 | 1.8万人学习

JavaScript函数与闭包
JavaScript函数与闭包

共32课时 | 4.2万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号