当前位置: 首页 > article >正文

javascript的闭包学习

为什么要产生闭包的概念,通俗来说一下。

公司有一个项目,分为两个部分,张三、李四各分配一个部分。

张三.js代码:

var key='我要吃肉'
function fn(){
    console.log(key);
}

李四.js代码:

var key='我要喝酒'
function fn(){
    console.log(key);
}

如果在张三.js或者李四.js代码中分别运行,都没有问题。不过,这是一个网页项目的两部分,需要综合到一起去执行,此时就出现了问题。

我的本意是张三的执行,李四的也执行。实际情况:

只执行了李四的fn,如图。

如果js代码中不用var定义变量,而是用let定义变量,就会更明确的显示出问题。

那就是在 first_js.html这个总项目中,张三和李四的变量、函数名等重复定义了。

闭包就是为了解决这个问题。

那么,如何解决呢?

这就是需要“作用域”这个概念。也就是,在函数内部定义的变量,只在这个函数内有效。

对了,程序员很机智,给张三.js和李四.js的代码,分别用一个函数包含起来,它们不就分别有自己的独立空间了吗?对,这就是闭包。闭:就是封闭的环境(函数内)存放局部变量和方法。包:就是在这个环境中,实现想要的功能。

代码就变成了这样:

再多想一步,既然这个所谓的外部函数的作用只是给出一个独立的空间,它们的名字是不是就略显多余呢?

这时,就自然想到了自运行函数。

这里还有个问题,张三和李四虽然有了自己的空间,那么它们想要实现的功能(函数),怎么让总项目所使用呢?

好办,那就分别导出其功能函数就行了。 【注意:此时返回的变量是一个函数】

这样,在总项目中,分别运行zs()和ls()就可以了。

进一步思考,如何张三.js和李四.js需要实现多个功能,该如何导出呢?

将导出函数变为导出对象(对象中有多个功能函数)就行了。【注意:此时返回的变量是一个对象】

在总项目中,依次调用:

结果正确。

至此,就解决了各个分项目中存在同变量名冲突的问题。

张三和李四再也不用为自己代码中的变量名称冲突而烦恼了。

这就是闭包的来源和作用。 

小知识:自运行函数的格式(张三.js为自运行函数,李四.js为普通函数的运行)


http://www.kler.cn/a/319477.html

相关文章:

  • NVIDIA Isaac Sim 仿真平台体验测评
  • ️️一篇快速上手 AJAX 异步前后端交互
  • Java设计模式面试题及参考答案
  • 【入门篇】A+B Problem——多语言版
  • nuxt3添加wowjs动效
  • python获取iOS最近业务日志的两种方法
  • Vue报错 ‘vite‘ 不是内部或外部命令,也不是可运行的程序或批处理文件
  • 电路板上电子元件检测系统源码分享
  • Spring Boot 配置全流程 总结
  • 视频转文字工具:开启视频内容深度挖掘的钥匙
  • centos7 docker部署nacos
  • HCIA--实验十七:EASY IP的NAT实现
  • 拒绝信息泄露!VMD滚动分解 + Informer-BiLSTM并行预测模型
  • PyFluent常用代码 1
  • QT开发模式(二):QML/JS/C++混合编程
  • 中国电子学会202312青少年软件编程(Python)等级考试试卷(四级)真题
  • 基于VUE的医院抗生素使用审核流程信息化管理系统
  • 前端如何实现截图?
  • webView2 隐藏滚动条
  • 【数据结构初阶】排序算法(上)插入排序与选择排序
  • echarts实现地图下钻并解决海南群岛显示缩略图
  • 【数学分析笔记】第3章第4节闭区间上的连续函数(1)
  • 外包干了5天,技术退步明显.......
  • 换脸黑科技FaceFusion 3.0(Windows Mac整合包)震撼来袭!
  • 初识网络编程(上)
  • 焊接缺陷检测系统源码分享