浅谈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读取ASP设定的COOKIE
Nov 24 Javascript
js操作textarea 常用方法总结
Dec 03 Javascript
圣诞节Merry Christmas给博客添加浪漫的下雪效果基于jquery实现
Dec 27 Javascript
JS将表单导出成EXCEL的实例代码
Nov 11 Javascript
jquery easyUI中ajax异步校验用户名
Aug 19 Javascript
开发Vue树形组件的示例代码
Dec 21 Javascript
vue 组件中添加样式不生效的解决方法
Jul 06 Javascript
vue3.0 CLI - 2.1 -  component 组件入门教程
Sep 14 Javascript
Vue组件间通信 Vuex的用法解析
Aug 05 Javascript
vue+axios 拦截器实现统一token的案例
Sep 11 Javascript
Vue+element+cookie记住密码功能的简单实现方法
Sep 20 Javascript
JavaScript中常用的3种弹出提示框(alert、confirm、prompt)
Nov 10 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
jq的get传参数在utf-8中乱码问题的解决php版
2008/07/23 PHP
ThinkPHP写第一个模块应用
2012/02/20 PHP
php+ajax实现无刷新分页的方法
2014/11/04 PHP
php常用图片处理类
2016/03/16 PHP
php实现的mysqldb读写分离操作类示例
2017/02/07 PHP
用JavaScript实现仿Windows关机效果
2007/03/10 Javascript
jQuery 入门讲解1
2009/04/15 Javascript
JavaScript字符串插入、删除、替换函数使用示例
2013/07/25 Javascript
jQuery的each终止或跳过示例代码
2013/12/12 Javascript
asp.net刷新本页面的六种方法总结
2014/01/07 Javascript
js控制iframe的高度/宽度让其自适应内容
2014/04/09 Javascript
JQuery实现可直接编辑的表格
2015/04/16 Javascript
innerHTML中标签可以换行的方法汇总
2015/08/14 Javascript
基于javascript实现右下角浮动广告效果
2016/01/08 Javascript
JS弹出新窗口被拦截的解决方法
2016/08/09 Javascript
Javascript之面向对象--方法
2016/12/02 Javascript
Vuex之理解Store的用法
2017/04/19 Javascript
webpack配置导致字体图标无法显示的解决方法
2018/03/06 Javascript
vue.js 实现评价五角星组件的实例代码
2018/08/13 Javascript
layer.open关闭父窗口 以及调用父页面的方法
2018/08/17 Javascript
Laravel 如何在blade文件中使用Vue组件的示例代码
2020/06/28 Javascript
git使用.gitignore设置不生效或不起作用问题的解决方法
2017/06/01 Python
Python和Java的语法对比分析语法简洁上python的确完美胜出
2019/05/10 Python
为什么从Python 3.6开始字典有序并效率更高
2019/07/15 Python
Python xlrd excel文件操作代码实例
2020/03/10 Python
使用 Python 读取电子表格中的数据实例详解
2020/04/17 Python
Python实现一个简单的递归下降分析器
2020/08/01 Python
python爬取天气数据的实例详解
2020/11/20 Python
应届生财务管理求职信
2013/11/06 职场文书
应付会计岗位职责
2013/12/12 职场文书
老公给老婆的道歉信
2014/01/10 职场文书
销售助理岗位职责
2014/02/21 职场文书
教师党员公开承诺事项
2014/05/28 职场文书
学校创先争优活动总结
2014/08/28 职场文书
小学英语教学经验交流材料
2015/11/02 职场文书
幼儿园大班教师评语
2019/06/21 职场文书