浅谈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.js是否已加载的判断代码
May 20 Javascript
js解析与序列化json数据(三)json的解析探讨
Feb 01 Javascript
js Array对象的扩展函数代码
Apr 24 Javascript
Jquery-1.9.1源码分析系列(十一)之DOM操作
Nov 25 Javascript
详解JavaScript权威指南之对象
Sep 27 Javascript
BootStrap Validator对于隐藏域验证和程序赋值即时验证的问题浅析
Dec 01 Javascript
Javascript中call,apply,bind方法的详解与总结
Dec 12 Javascript
JavaScript ES6中export、import与export default的用法和区别
Mar 14 Javascript
基于bootstrap写的一点localStorage本地储存
Nov 21 Javascript
环形加载进度条封装(Vue插件版和原生js版)
Dec 04 Javascript
微信小程序 wx.getUserInfo引导用户授权问题实例分析
Mar 09 Javascript
javascript中contains是否包含功能实现代码(扩展字符、数组、dom)
Apr 07 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写的小东西
2006/12/06 PHP
在WAMP环境下搭建ZendDebugger php调试工具的方法
2011/07/18 PHP
php入门之连接mysql数据库的一个类
2012/04/21 PHP
完美解决PHP中的Cannot modify header information 问题
2013/08/12 PHP
常用的php图片处理类(水印、等比缩放、固定高宽)分享
2015/06/19 PHP
基于PHP给大家讲解防刷票的一些技巧
2015/11/18 PHP
PHP使用DOM对XML解析处理操作示例
2019/07/04 PHP
用js写了一个类似php的print_r输出换行功能
2013/02/18 Javascript
Jquery多选框互相内容交换的实例代码
2013/07/04 Javascript
JavaScript实现的图像模糊算法代码分享
2014/04/22 Javascript
node.js中的console.error方法使用说明
2014/12/10 Javascript
element 结合vue 在表单验证时有值却提示错误的解决办法
2018/01/22 Javascript
Nodejs实现爬虫抓取数据实例解析
2018/07/05 NodeJs
微信小程序使用wxParse解析html的实现示例
2018/08/30 Javascript
6行代码实现微信小程序页面返回顶部效果
2018/12/28 Javascript
使用 Vue cli 3.0 构建自定义组件库的方法
2019/04/30 Javascript
vue-cli脚手架引入弹出层layer插件的几种方法
2019/06/24 Javascript
vue实现瀑布流组件滑动加载更多
2020/03/10 Javascript
浅析Python中的多重继承
2015/04/28 Python
Python中的下划线详解
2015/06/24 Python
python魔法方法-自定义序列详解
2016/07/21 Python
python邮件发送smtplib使用详解
2020/06/16 Python
python 移动图片到另外一个文件夹的实例
2019/01/10 Python
Python里字典的基本用法(包括嵌套字典)
2019/02/27 Python
Python3如何实现Win10桌面自动切换
2020/08/11 Python
通过css3动画和opacity透明度实现呼吸灯效果
2019/08/09 HTML / CSS
AHAVA美国官方网站:死海海泥护肤品牌
2016/10/18 全球购物
家庭睡衣和家庭用品:Little Blue House
2018/03/18 全球购物
JBL加拿大官方商店:扬声器、耳机等
2020/10/23 全球购物
个人求职信范文分享
2013/12/13 职场文书
生产部统计员岗位职责
2014/01/05 职场文书
村捐赠仪式答谢词
2014/01/21 职场文书
年度献血先进个人事迹材料
2014/02/14 职场文书
自考毕业自我鉴定
2014/03/18 职场文书
教师爱岗敬业演讲稿
2014/05/05 职场文书
基于HTML十秒做出淘宝页面
2021/10/24 HTML / CSS