浅谈javascript的闭包


Posted in Javascript onJanuary 23, 2017

关于闭包的解释

我们将作用域链描述为一个对象列表,不是绑定的栈。每次调用javascript函数的时候,都会为之创建一个新的对象来保存变量,把这个对象添那个加至作用域中,当函数返回时,就从作用域链中将这个绑定变量的对象删除,如果不存在嵌套函数,也没有其他引用指向这个绑定的对象,它就会被当垃圾回收掉,

(function () {
 var val = null;
 var callback;
 setTimeout(function () {
  val = 1;
  callback(val)
 },1000)
 window.getVal = function(fn){
  callback = fn;
 }
 })();
 (function(){
 var b =3;
 getVal(function (val) {
  console.log(val);//1
  console.log(b); //3
 getVal(function (val) {
 console.log(val);
 console.log(b); //这里为什么还能打印出b这个变量呢/. 
 });
 //这里匿名函数其实就是一个闭包,你就相当于通过getVal函数把这个闭包传递出去了,你想想看,闭包是不是这样?
})();
//2作用域
 (function(){
 var b =3;
 var ret = function (val) {
  console.log(val);

利用闭包实现的私有属性存取方法

function c     
  return {
  count:function(){
  return n++;
  }
  };
  }
 var a=counter();
 alert(a.count());//返回的0;
 alert(a.count());//返回的是1;

定义的闭包实现的私有属性方法

function addPrivateProperty(o,name,predicate){
var value;
o["get"+name]=function(){return value);}//get 存取器的属性只读,将其直接简单的返回
//setter方法检验值是否合法,若不合法就抛出异常
o["set"+name]=function(v){{
if(predicate&&!predicate(v)) throw Error("");
else {
value=v;
}
}

典型错误

function constfuncs(){
var funcs=[];
for(var i=0;i<10;i++){
funcs[i]=function(){return i;};
}
return funcs;
}
var func=constfuncs();
console.log(func[5]());
;//返回值? 10

由于此函数的闭包都是在同一个函数调用中定义的,因此可以共享变量i;

关联到闭包的作用域链都是活动的,嵌套的函数不会将作用域内的私有成员复制一份,也不会对所绑定的变量生成静态快照;在闭包时后this是javascript的一个关键字而不是变量

解决办法

function Bb(){
this.run=function(){}//this就是Bb这个对象;
}
而function run(){
function gg(){alert(this就是window)}//this就是window;`
}

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript Undefined,Null类型和NaN值区别
Oct 22 Javascript
使用javascript实现有效时间的控制,并显示将要过期的时间
Jan 02 Javascript
jQuery截取指定长度字符串的实现原理及代码
Jul 01 Javascript
JavaScript中string转换成number介绍
Dec 31 Javascript
Jquery UI实现一次拖拽多个选中的元素操作
Dec 01 Javascript
jQuery动态移除与增加onclick属性的方法详解
Jun 07 jQuery
vue自定义移动端touch事件之点击、滑动、长按事件
Jul 10 Javascript
小程序实现搜索框
Jun 19 Javascript
详解element-ui动态限定的日期范围选择器代码片段
Jul 03 Javascript
JS轮播图的实现方法
Aug 24 Javascript
JavaScript代码简化技巧实例解析
Sep 09 Javascript
element-ui 弹窗组件封装的步骤
Jan 22 Javascript
JS复制对应id的内容到粘贴板(Ctrl+C效果)
Jan 23 #Javascript
JavaScript常用正则验证函数实例小结【年龄,数字,Email,手机,URL,日期等】
Jan 23 #Javascript
Node.js Express 框架 POST方法详解
Jan 23 #Javascript
js 颜色选择插件
Jan 23 #Javascript
JavaScript常用正则函数用法示例
Jan 23 #Javascript
详解微信小程序 wx.uploadFile 的编码坑
Jan 23 #Javascript
微信小程序侧边栏滑动特效(左右滑动)
Jan 23 #Javascript
You might like
php include加载文件两种方式效率比较
2010/08/08 PHP
PHP封装请求类实例分析【基于Yii框架】
2019/10/17 PHP
JavaScript转换农历类实现及调用方法
2013/01/27 Javascript
jQuery的Ajax的自动完成功能控件简要说明
2013/02/22 Javascript
JavaScript简单实现鼠标拖动选择功能
2014/03/06 Javascript
jQuery中Ajax的get、post等方法详解
2015/01/20 Javascript
jQuery实现的超酷苹果风格图标滑出菜单效果代码
2015/09/16 Javascript
JavaScript检查子字符串是否在字符串中的方法
2016/02/03 Javascript
【经典源码收藏】jQuery实用代码片段(筛选,搜索,样式,清除默认值,多选等)
2016/06/07 Javascript
基于bootstrap的选择框插件icheck
2016/12/23 Javascript
jquery实现转盘抽奖功能
2017/01/06 Javascript
Vue.js基础学习之class与样式绑定
2017/03/20 Javascript
javascript流程控制语句集合
2017/09/18 Javascript
vue-cli项目根据线上环境分别打出测试包和生产包
2018/05/23 Javascript
浅谈node中的cluster集群
2018/06/02 Javascript
create-react-app安装出错问题解决方法
2018/09/04 Javascript
基于jquery ajax的多文件上传进度条过程解析
2019/09/11 jQuery
Vue 实现创建全局组件,并且使用Vue.use() 载入方式
2020/08/11 Javascript
[02:30]DOTA2英雄基础教程 暗影恶魔
2013/12/17 DOTA
Python设计模式中单例模式的实现及在Tornado中的应用
2016/03/02 Python
用Eclipse写python程序
2018/02/10 Python
django 删除数据库表后重新同步的方法
2018/05/27 Python
详解Django中间件的5种自定义方法
2018/07/26 Python
python实现控制电脑鼠标和键盘,登录QQ的方法示例
2019/07/06 Python
如何在django中实现分页功能
2020/04/22 Python
美国球迷装备的第一来源:FOCO
2020/07/03 全球购物
大学生的网上创业计划书
2013/12/31 职场文书
党员创先争优承诺书
2014/03/26 职场文书
党的群众路线教育实践方案
2014/05/11 职场文书
2015年工会工作总结
2015/03/30 职场文书
西部计划志愿者工作总结
2015/08/11 职场文书
2019秋季运动会口号
2019/06/25 职场文书
vue实现移动端div拖动效果
2022/03/03 Vue.js
Python 的演示平台支持 WSGI 接口的应用
2022/04/20 Python
nginx之queue的具体使用
2022/06/28 Servers
Go中使用gjson来操作JSON数据的实现
2022/08/14 Golang