浅谈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兼容性测试实例
Jul 01 Javascript
jQuery ajax dataType值为text json探索分享
Sep 23 Javascript
JavaScript实现点击自动选择TextArea文本的方法
Jul 02 Javascript
Javascript技术难点之apply,call与this之间的衔接
Dec 04 Javascript
JS组件Bootstrap dropdown组件扩展hover事件
Apr 17 Javascript
微信小程序开发的四十个技术窍门总结(推荐)
Jan 23 Javascript
BootStrap表单控件之文本域textarea
May 23 Javascript
浅谈JS中的反柯里化( uncurrying)
Aug 17 Javascript
js 下拉菜单点击旁边收起实现(踩坑记)
Sep 29 Javascript
原生javascript制作贪吃蛇小游戏的方法分析
Feb 26 Javascript
es5 类与es6中class的区别小结
Nov 09 Javascript
浅析VUE防抖与节流
Nov 24 Vue.js
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面向对象教程之自定义类
2014/06/10 PHP
php对包含html标签的字符串进行截取的函数分享
2014/06/19 PHP
ThinkPHP模板输出display用法分析
2014/11/26 PHP
PHP文件与目录操作示例
2016/12/24 PHP
thinkPHP5项目中实现QQ第三方登录功能
2017/10/20 PHP
yii框架redis结合php实现秒杀效果(实例代码)
2017/10/26 PHP
php文件上传原理与实现方法详解
2019/12/20 PHP
ThinkPHP5与单元测试PHPUnit使用详解
2020/02/23 PHP
jQuery实现单行文字间歇向上滚动源代码
2013/06/02 Javascript
jquery隐藏标签和显示标签的实例
2013/11/11 Javascript
node.js中的events.EventEmitter.listenerCount方法使用说明
2014/12/08 Javascript
JS实现固定在右下角可展开收缩DIV层的方法
2015/02/13 Javascript
实现React单页应用的方法详解
2016/08/02 Javascript
谈谈对JavaScript原生拖放的深入理解
2016/09/20 Javascript
微信小程序 wxapp地图 map详解
2016/10/31 Javascript
vuex实现登录状态的存储,未登录状态不允许浏览的方法
2018/03/09 Javascript
JS实现移动端触屏拖拽功能
2018/07/31 Javascript
小程序二次贝塞尔曲线实现购物车商品曲线飞入效果
2019/01/07 Javascript
vue spa应用中的路由缓存问题与解决方案
2019/05/31 Javascript
React+TypeScript+webpack4多入口配置详解
2019/08/08 Javascript
Python迭代和迭代器详解
2016/11/10 Python
在Pandas中给多层索引降级的方法
2018/11/16 Python
解决Pytorch训练过程中loss不下降的问题
2020/01/02 Python
python解释器pycharm安装及环境变量配置教程图文详解
2020/02/26 Python
解决Keras的自定义lambda层去reshape张量时model保存出错问题
2020/07/01 Python
详解Python中的Lock和Rlock
2021/01/26 Python
2014年商场超市庆元旦活动方案
2014/02/14 职场文书
大学生职业生涯规划书参考模板
2014/03/05 职场文书
党员教师工作决心书
2014/03/13 职场文书
五一口号
2014/06/19 职场文书
平面设计专业求职信
2014/08/09 职场文书
公司试用期员工自我评价
2014/09/17 职场文书
2014市府办领导班子“四风问题”对照检查材料思想汇报
2014/09/24 职场文书
人民调解协议书范本
2014/10/11 职场文书
慰问信的写作格式及范文!
2019/06/24 职场文书
MySQL安装失败的原因及解决步骤
2022/06/14 MySQL