浅谈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 相关文章推荐
JS效率个人经验谈(8-15更新),加入range技巧
Jan 09 Javascript
javascript dom代码应用 简单的相册[firefox only]
Jun 12 Javascript
js 模拟气泡屏保效果代码
Jul 10 Javascript
JS等比例缩小图片尺寸的实例
Feb 27 Javascript
node.js正则表达式获取网页中所有链接的代码实例
Jun 03 Javascript
JavaScript操作cookie类实例
Mar 31 Javascript
基于bootstrap写的一点localStorage本地储存
Nov 21 Javascript
浅谈FastClick 填坑及源码解析
Mar 02 Javascript
vue.js响应式原理解析与实现
Jun 22 Javascript
简单学习5种处理Vue.js异常的方法
Jun 17 Javascript
vue实现数据控制视图的原理解析
Jan 07 Javascript
jquery插件实现代码雨特效
Apr 24 jQuery
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获取目录所有文件并将结果保存到数组(实例)
2013/10/25 PHP
PHP加Nginx实现动态裁剪图片方案
2014/03/10 PHP
PHP使用curl_multi_select解决curl_multi网页假死问题的方法
2018/08/15 PHP
php设计模式之状态模式实例分析【星际争霸游戏案例】
2020/03/26 PHP
分享一个自定义的console类 让你不再纠结JS中的调试代码的兼容
2012/04/20 Javascript
js模仿hover的具体实现代码
2013/12/30 Javascript
javascript感应鼠标图片透明度显示的方法
2015/02/24 Javascript
JS控制弹出新页面窗口位置和大小的方法
2015/03/02 Javascript
JavaScript对数组进行随机重排的方法
2015/07/22 Javascript
jQuery+css3实现文字跟随鼠标的上下抖动
2015/07/31 Javascript
前端框架Vue.js中Directive知识详解
2016/09/12 Javascript
js基础之DOM中document对象的常用属性方法详解
2016/10/28 Javascript
jQuery实现导航回弹效果
2017/02/27 Javascript
js实现添加删除表格(两种方法)
2017/04/27 Javascript
Node.js中使用mongoose操作mongodb数据库的方法
2017/09/12 Javascript
js判断文件类型大小并给出提示的实现方法
2018/01/03 Javascript
深入了解query和params的使用区别
2019/06/24 Javascript
Vue中axios的封装(报错、鉴权、跳转、拦截、提示)
2019/08/20 Javascript
解决Vue打包上线之后部分CSS不生效的问题
2019/11/12 Javascript
JavaScript交换两个变量方法实例
2019/11/25 Javascript
小程序跨页面交互的作用与方法详解
2020/01/07 Javascript
vue+ts下对axios的封装实现
2020/02/18 Javascript
Angular短信模板校验代码
2020/09/23 Javascript
Python基于smtplib实现异步发送邮件服务
2015/05/28 Python
Python把csv数据写入list和字典类型的变量脚本方法
2018/06/15 Python
Python实现在某个数组中查找一个值的算法示例
2018/06/27 Python
Python二次规划和线性规划使用实例
2019/12/09 Python
python实现读取类别频数数据画水平条形图案例
2020/04/24 Python
python实现秒杀商品的微信自动提醒功能(代码详解)
2020/04/27 Python
CentOS 7如何实现定时执行python脚本
2020/06/24 Python
python 实现压缩和解压缩的示例
2020/09/22 Python
Django后端按照日期查询的方法教程
2021/02/28 Python
2014年大堂经理工作总结
2014/11/21 职场文书
会计工作总结范文2014
2014/12/23 职场文书
iSCSI服务器CHAP双向认证配置
2022/04/01 Servers
MySQL中EXPLAIN语句及用法
2022/05/20 MySQL