浅谈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 相关文章推荐
PJ Blog修改-禁止复制的代码和方法
Oct 25 Javascript
自己动手开发jQuery插件教程
Aug 25 Javascript
JS子父窗口互相操作取值赋值的方法介绍
May 11 Javascript
jquery下div 的resize事件示例代码
Mar 09 Javascript
JavaScript从数组的indexOf()深入之Object的Property机制
May 11 Javascript
AngularJS入门教程之Cookies读写操作示例
Nov 02 Javascript
Vuex之理解Getters的用法实例
Apr 19 Javascript
node.js 抓取代理ip实例代码
Apr 30 Javascript
React学习笔记之条件渲染(一)
Jul 02 Javascript
JavaScript生成指定范围随机数和随机序列的方法
May 05 Javascript
Element-UI中关于table表格的那些骚操作(小结)
Aug 15 Javascript
解决echarts图表使用v-show控制图表显示不全的问题
Jul 19 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中的Class的几点个人看法
2006/10/09 PHP
php打开远程文件的方法和风险及解决方法
2013/11/12 PHP
php+memcache实现的网站在线人数统计代码
2014/07/04 PHP
PHP制作百度词典查词采集器
2015/01/29 PHP
php删除文本文件中重复行的方法
2015/04/28 PHP
php微信公众号js-sdk开发应用
2016/11/28 PHP
PHP验证码无法显示的原因及解决办法
2017/08/11 PHP
PHP+Ajax简单get验证操作示例
2019/03/02 PHP
javascript setTimeout和setInterval 的区别
2009/12/08 Javascript
jQuery学习3:操作元素属性和特性
2010/02/07 Javascript
JavaScript加强之自定义callback示例
2013/09/21 Javascript
JQueryiframe页面操作父页面中的元素与方法(实例讲解)
2013/11/19 Javascript
Jquery Uploadify上传带进度条的简单实例
2014/02/12 Javascript
跟我学习javascript创建对象(类)的8种方法
2015/11/20 Javascript
详解Node.js:events事件模块
2016/11/24 Javascript
js实现横向拖拽导航条功能
2017/02/17 Javascript
javascript 实现文本使用省略号替代(超出固定高度的情况)
2017/02/21 Javascript
jQuery的三种bind/One/Live/On事件绑定使用方法
2017/02/23 Javascript
Web纯前端“旭日图”实现元素周期表
2017/03/10 Javascript
js使用generator函数同步执行ajax任务
2017/09/05 Javascript
JavaScript 保护变量不被随意修改的实现代码
2017/09/27 Javascript
p5.js入门教程之图片加载
2018/03/20 Javascript
详解webpack4.x之搭建前端开发环境
2019/03/28 Javascript
javascript实现小型区块链功能
2019/04/03 Javascript
ES6使用新特性Proxy实现的数据绑定功能实例
2020/05/11 Javascript
用python处理MS Word的实例讲解
2018/05/08 Python
使用tensorflow显示pb模型的所有网络结点方式
2020/01/23 Python
纯CSS实现预加载动画效果
2017/09/06 HTML / CSS
cosme官方海外旗舰店:日本最大化妆品和美容产品的综合口碑网站
2017/01/18 全球购物
Giglio英国站:意大利奢侈品购物网
2018/03/06 全球购物
师范教师毕业鉴定
2014/01/13 职场文书
三年大学自我鉴定
2014/01/16 职场文书
学习保证书范文
2014/04/30 职场文书
群众路线剖析材料(四风)
2014/11/05 职场文书
社区党务工作总结2015
2015/05/19 职场文书
物业管理交接协议书
2016/03/24 职场文书