浅谈js闭包理解


Posted in Javascript onMarch 28, 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 相关文章推荐
JQuery一种取同级值的方式(比如你在GridView中)
Mar 15 Javascript
Javascript在IE和FireFox中的不同表现简析
Dec 03 Javascript
巧用replace将文字表情替换为图片
Apr 17 Javascript
jQuery弹出层插件Lightbox_me使用指南
Apr 21 Javascript
JavaScript学习小结之被嫌弃的eval函数和with语句实例详解
Aug 01 Javascript
基于Vue.js实现数字拼图游戏
Aug 02 Javascript
vue-router history模式下的微信分享小结
Jul 05 Javascript
vue动画之点击按钮往上渐渐显示出来的实例
Sep 29 Javascript
jquery实现动态添加附件功能
Oct 23 jQuery
详解vue父子组件关于模态框状态的绑定方案
Jun 05 Javascript
vue 解决文本框被键盘遮住的问题
Nov 06 Javascript
微信小程序以7天为周期连续签到7天功能效果的示例代码
Aug 20 Javascript
微信小程序中转义字符的处理方法
Mar 28 #Javascript
微信小程序中使用Async-await方法异步请求变为同步请求方法
Mar 28 #Javascript
详解Js里的for…in和for…of的用法
Mar 28 #Javascript
ES7之Async/await的使用详解
Mar 28 #Javascript
详解vue-cli3多环境打包配置
Mar 28 #Javascript
微信小程序之onLaunch与onload异步问题详解
Mar 28 #Javascript
详解vue使用插槽分发内容slot的用法
Mar 28 #Javascript
You might like
PHP发明人谈MVC和网站设计架构 貌似他不支持php用mvc
2011/06/04 PHP
常见php数据文件缓存类汇总
2014/12/05 PHP
Thinkphp调用Image类生成缩略图的方法
2015/03/07 PHP
PHP滚动日志的代码实现
2015/06/10 PHP
php导出中文内容excel文件类实例
2015/07/06 PHP
浅谈PHP中如何实现Hook机制
2017/11/14 PHP
基于jquery的文章中所有图片width大小批量设置方法
2013/08/01 Javascript
用javascript删除当前行,添加行(示例代码)
2013/11/25 Javascript
jQuery中after()方法用法实例
2014/12/25 Javascript
jQuery UI设置固定日期选择特效代码分享
2015/08/27 Javascript
使用jquery实现鼠标滑过弹出更多相关信息层附源码下载
2015/11/23 Javascript
js实现文本框输入文字个数限制代码
2015/12/25 Javascript
JS遍历数组及打印数组实例分析
2016/01/21 Javascript
浅析JS原型继承与类的继承
2016/04/07 Javascript
JavaScript字符集编码与解码详谈
2017/02/02 Javascript
canvas的神奇用法
2017/02/03 Javascript
JS和JQuery实现雪花飘落效果
2017/11/30 jQuery
React Native react-navigation 导航使用详解
2017/12/01 Javascript
浅谈Vuejs中nextTick()异步更新队列源码解析
2017/12/31 Javascript
详解Nodejs get获取远程服务器接口数据
2019/03/26 NodeJs
Python的几个高级语法概念浅析(lambda表达式闭包装饰器)
2016/05/28 Python
python、java等哪一门编程语言适合人工智能?
2017/11/13 Python
python opencv设置摄像头分辨率以及各个参数的方法
2018/04/02 Python
在python 不同时区之间的差值与转换方法
2019/01/14 Python
Django框架组成结构、基本概念与文件功能分析
2019/07/30 Python
python爬虫selenium和phantomJs使用方法解析
2019/08/08 Python
TensorFlow的reshape操作 tf.reshape的实现
2020/04/19 Python
django美化后台django-suit的安装配置操作
2020/07/12 Python
基于python实现简单C/S模式代码实例
2020/09/14 Python
使用CSS3制作倾斜导航条和毛玻璃效果
2017/09/12 HTML / CSS
英国优质鞋类专家:Robinson’s Shoes
2017/12/08 全球购物
英国最大的割草机购买网站:Just Lawnmowers
2019/11/02 全球购物
vue 中 get / delete 传递数组参数方法
2021/03/23 Vue.js
个人汇报材料范文
2014/12/30 职场文书
党员廉洁自律个人总结
2015/02/13 职场文书
SpringBoot详解整合Redis缓存方法
2022/07/15 Java/Android