[Javascript] 闭包 closure
2015-12-01 16:54
633 查看
闭包是十分的重要
校招面试的几家公司都要问到闭包的问题
最经典的是问到
闭包是什么 有什么作用
闭包循环和累加的应用
更改闭包的作用域
闭包是一个 有权访问另一个函数作用域的变量的函数。且始终放在内存当中
块级作用域
(function(){
//块级作用域
})();
解决:
解决:
(1) that =this
(2) call
校招面试的几家公司都要问到闭包的问题
最经典的是问到
闭包是什么 有什么作用
闭包循环和累加的应用
更改闭包的作用域
(1) 概念
全局下 取不到局部的变量的值<script type="text/javascript"> function a(){ var name1="jessica"; console.log(name1); } console.log(name1); //Uncaught ReferenceError: name1 is not defined </script>
闭包是一个 有权访问另一个函数作用域的变量的函数。且始终放在内存当中
<script type="text/javascript"> function a(){ var name="jessica"; return function(){//匿名函数 闭包的使用 return name; } } console.log(a()()); //jessica </script>
(2) 闭包+变量
问题:闭包只能取到任何变量的最后一个值块级作用域
(function(){
//块级作用域
})();
(3) 闭包经典案例 - 累加
<script type="text/javascript"> function a(){ var i=100; return function(){ i++; return i; } } var b=a();//获取函数 console.log(b()); console.log(b()); console.log(b()); console.log(b()); console.log(b()); </script>
(4) 闭包经典案例 - 循环
问题:<script type="text/javascript"> function a(){ var array=[]; for (var i = 0; i < 5; i++) { array[i]=function(){ return i; } } return array; } var b=a(); for (var i = 0; i < b.length; i++) { console.log(b[i]());//五个5 不是01234 //b[i]调用的是匿名函数,匿名函数并没有自我执行 //等调用的时候, a()已经执行完毕了 }; </script>
解决:
<script type="text/javascript"> function a(){ var array=[]; for (var i = 0; i < 5; i++) { array[i]=(function(i){ return i; })(i);//匿名函数自我执行 } return array; } var b=a(); for (var i = 0; i < b.length; i++) { console.log(b[i]); }; </script>
(4) this对象
<script type="text/javascript"> var name="jessica"; var obj={ name:"krystal", a:function(){ return function(){ return this.name; } /*取到的值为什么是jessica? 因为在闭包中, this指的是window */ } } var b=obj.a(); console.log(b());//jessica </script>
解决:
(1) that =this
<script type="text/javascript"> var name="jessica"; var obj={ name:"krystal", a:function(){ var that=this; return function(){ return that.name; } } } var b=obj.a(); console.log(b());//krystal </script>
(2) call
<script type="text/javascript"> var name="jessica"; var obj={ name:"krystal", a:function(){ return function(){ return this.name; } } } console.log(obj.a().call(obj)); //用obj来冒充, 改变作用域来执行a() </script>
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- 深入理解PHP之匿名函数
- JavaScript演示排序算法
- javascript实现10进制转为N进制数
- 100 个最佳 Ubuntu 应用(中)
- 在 AppImage、Flathub 和 Snapcraft 平台上搜索 Linux 应用
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 对一个分号引发的错误研究
- 异步流程控制:7 行代码学会 co 模块
- ES6 走马观花(ECMAScript2015 新特性)
- JavaScript拆分字符串时产生空字符的原因
- Canvas 在高清屏下绘制图片变模糊的解决方法
- JavaScript 各种遍历方式详解
- call/apply/bind 的理解与实例分享
- 如何创建对象以及jQuery中创建对象的方式