浅谈js闭包理解


Posted in Javascript onApril 01, 2019

闭包是js中的一大特色,也是一大难点。简单来说,所谓闭包就是说,一个函数能够访问其函数外部作用域中的变量。

闭包的三大特点为:

1、函数嵌套函数

2、内部函数可以访问外部函数的变量

3、参数和变量不会被回收。

举例来说:

function test(){
   var a=1;
   return function(){
    alert(a);
   }
  }
  var try=test();
  try();//弹出a的值

这个例子中,变量a在test方法外部是无法访问的,但test方法里面,嵌套了一个匿名函数,通过return返回,test作用域中的变量a,

可以在匿名函数中访问。并且当test方法执行后,变量a所占内存并不会释放,以达到嵌套的函数还可以访问的目的。

闭包的作用在于,可以通过闭包,设计私有变量及方法。

举例来说:在java中创建perosn类,含有私有变量name。

public class Person{
  private String name='wy';
  public Person(val){
    name=val;
  }
  public void setName(val){
    name=val;
  }
  public String getName(){
   return name;
  }
}

在js中实现类似java创建类的功能:

(function(){
      var name="wangyu";
      Person=function (val) {
        name=val;
      }
      Person.prototype.setName=function(val){
        name=val;
      }
      Person.prototype.getName=function () {
        return name;
      }
    })();
   var person1=new Person("sj");
   alert(this.name)//undefined 因为在function作用域外不能访问
   alert(person1.getName());//sj

在function里面的name,由于是在function作用域中,所以外部无法访问,但是可以通过创建person对象,调用person的方法,来达到修改和访问name值的目的,类似于java类中的私有变量,外部无法访问,只能通过类方法访问。

再看一个私有变量的例子:

var aaa = (function(){
    var a = 1;
    function bbb(){
        a++;
        alert(a);
    }
    function ccc(){
        a++;
        alert(a);
    }
    return {
        b:bbb,       //json结构
        c:ccc
    }
  })();
  alert(aaa.a)//undefined 
  aaa.b();   //2
  aaa.c()   //3

总结:

1、闭包是指有权访问另一个函数作用域中的变量的函数,创建闭包的最常见的方式就是在一个函数内创建另一个函数,通过另一个函数访问这个函数的局部变量。闭包的缺点就是常驻内存,会增大内存使用量,使用不当很容易造成内存泄露。

2、不必纠结到底怎样才算闭包,其实你写的每一个函数都算作闭包,即使是全局函数,你访问函数外部的全局变量时,就是闭包的体现。

以上所述是小编给大家介绍的js闭包理解详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript中"/"运算符常见错误
Oct 13 Javascript
JS自调用匿名函数具体实现
Feb 11 Javascript
JS中使用sort结合localeCompare实现中文排序实例
Jul 23 Javascript
更高效的使用JQuery 这里总结了8个小技巧
Apr 13 Javascript
深入理解jQuery.data() 的实现方式
Nov 30 Javascript
Vue2.x中的父组件传递数据至子组件的方法
May 01 Javascript
react-router4 嵌套路由的使用方法
Jul 24 Javascript
JavaScript 九种跨域方式实现原理
Feb 11 Javascript
解决echarts echarts数据动态更新和dataZoom被重置问题
Jul 20 Javascript
jQuery实现查看图片功能
Dec 01 jQuery
详解微信小程序「渲染层网络层错误」的解决方法
Jan 06 Javascript
微信小程序抽奖组件的使用步骤
Jan 11 Javascript
详解Vue之父子组件传值
Apr 01 #Javascript
微信二次分享报错invalid signature问题及解决方法
Apr 01 #Javascript
JS中的防抖与节流及作用详解
Apr 01 #Javascript
微信小程序 slot踩坑的解决
Apr 01 #Javascript
浅谈Vue.js 关于页面加载完成后执行一个方法的问题
Apr 01 #Javascript
VUE脚手架的下载和配置步骤详解
Apr 01 #Javascript
详解JavaScript中的函数、对象
Apr 01 #Javascript
You might like
PHP使用pdo连接access数据库并循环显示数据操作示例
2018/06/05 PHP
使用js+jquery实现无限极联动
2013/05/23 Javascript
简单实用jquery版三级联动select示例
2013/07/04 Javascript
javascript事件函数中获得事件源的两种不错方法
2014/03/17 Javascript
jQuery实现瀑布流的取巧做法分享
2015/01/12 Javascript
JS获取网页图片name属性的方法
2015/04/01 Javascript
JavaScript实现99乘法表及隔行变色实例代码
2016/02/24 Javascript
js数组常用操作方法小结(增加,删除,合并,分割等)
2016/08/02 Javascript
JS实现页面载入时随机显示图片效果
2016/09/07 Javascript
JS定时器实现数值从0到10来回变化
2016/12/09 Javascript
使用JavaScript根据图片获取条形码的方法
2017/07/04 Javascript
用js屏蔽被http劫持的浮动广告实现方法
2017/08/10 Javascript
JS设计模式之访问者模式定义与用法分析
2018/02/05 Javascript
详解如何使用babel进行es6文件的编译
2018/05/29 Javascript
vue.js计算属性computed用法实例分析
2018/07/06 Javascript
vue 自定义组件的写法与用法详解
2020/03/04 Javascript
JavaScript检测是否开启了控制台(F12调试工具)
2020/10/02 Javascript
[01:10]DOTA2亚洲邀请赛 征战号角响彻全场
2015/01/06 DOTA
启动targetcli时遇到错误解决办法
2017/10/26 Python
在python中以相同顺序shuffle两个list的方法
2018/12/13 Python
解决python 文本过滤和清理问题
2019/08/28 Python
python的time模块和datetime模块实例解析
2019/11/29 Python
解决python运行启动报错问题
2020/06/01 Python
python实现xlwt xlrd 指定条件给excel行添加颜色
2020/07/14 Python
CSS3中设置3D变形的transform-style属性详解
2016/05/23 HTML / CSS
HTML5 拖放功能实现代码
2016/07/14 HTML / CSS
美国CVS药店官网:CVS Pharmacy
2018/07/26 全球购物
高中自我鉴定
2013/12/20 职场文书
在校硕士自我鉴定
2014/01/23 职场文书
酒店经理职责
2014/01/30 职场文书
大学毕业自我评价
2014/02/02 职场文书
11月升旗仪式讲话稿
2014/02/15 职场文书
低碳环保口号
2014/06/12 职场文书
党的群众路线教育实践活动个人对照检查材料(教师)
2014/11/04 职场文书
敬老院志愿者活动总结
2015/05/06 职场文书
my.ini优化mysql数据库性能的十个参数(推荐)
2021/05/26 MySQL