《JavaScript权威指南》学习——js闭包
序:闭包这个玩意啊~在很多没有代码块的语言中都会出现,已经成为大多程序员入门的一道坎,闭包让很多程序员觉得晦涩(事实上百度一下这个名词,真的说的很晦涩啊亲==|||),我第一次知道闭包这个名词是从《JavaScript权威指南》中读到的,当时还是2015年的3月份,我刚开始看寒假购买的书,前女友说这本书封面上的犀牛丑死了,我说“你懂啥!”==|||
话不多说,经过一番回忆,我想起来闭包这个东西直到分手后的5个月里都没有搞清楚,某一天我在实验室写完了三段js代码对比后,我了悟了这本神书的讲的闭包思想!
先来看下闭包的百度百科,且看(配图):

闭包是可以包含自由(未绑定到特定对象)变量的代码块;这些变量不是在这个代码块内或者任何全局上下文中定义的,而是在定义代码块的环境中定义(局部变量)。“闭包” 一词来源于以下两者的结合:要执行的代码块(由于自由变量被包含在代码块中,这些自由变量以及它们引用的对象没有被释放)和为自由变量提供绑定的计算环境(作用域)。
在 Scala、Scheme、Common Lisp、Smalltalk、Groovy、JavaScript、Ruby、 Python、Go、Lua、objective c、swift 以及Java(Java8及以上)等语言中都能找到对闭包不同程度的支持。
乍一看,百度说的神乎其神,什么代码块,什么局部变量,说白了,我们只要搞清js的代码的一点原理:作用域的释放和存在问题。
闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。
闭包有三个特性:
1.函数嵌套函数
2.函数内部可以引用外部的参数和变量
3.参数和变量不会被垃圾回收机制回收
对比下面三段代码:
且看看下面代码:
//全局变量的应用和变化
Var GLOBAL = 1 //全局变量
function change_global(){
var GLOBAL = 2; //重新定义了GLOBAL作为局部变量,不加var则变成了引用全局变量
alert(GLOBAL);
}
change_global();
Alert(GLOBAL);
浏览器显示:先2,后1。
结论:验证了一点,函数改变了局部变量,但没有改变全局变量,但是一旦去掉了局部变量GLOBAL前面的var那么结果就是2,2。函数执行完后,函数的作用域链被销毁,随之局部变量被销毁了!全局变量要等到页面关闭(程序结束)被销毁
如果很熟悉js语法和作用域链的,可以跳过上面的代码,我是为了说下面的代码!
且看下面代码:
//z是个普通的function,执行一次作用域链就被销毁
var function z(t){
var s=[1,2,3]; //局部变量s
s.push(t); //往s数组中添加数字
return s;
}
z(4); //执行后销毁这次
z(5); //执行后销毁这次
alert(z(6)); //执行后销毁这次
浏览器显示:1,2,3,6。
结论:4,5呢?当然是因为前两次执行结束后函数被销毁了,所以最后只有6被添加进去了,充分证明了js执行函数在内存中的原理——执行完就销毁function中的一切!
上面的话不完全对,真的是一切吗?
且看下面代码:
//x这是个闭包函数,结束后会被销毁,但是因为他返回了另一个函数,这个函数调用并返回了局部变量s,所以s不能被摧毁了,必须被保留下来!
//x这是个闭包函数,结束后会被销毁,但是因为他返回了另一个函数,这个函数调用并返回了局部变量s,所以s不能被摧毁了,必须被保留下来!
function x(){
var s=[1,2,3]; //一样的局部变量s
return function(t){
s.push(t); //一样往s中添加数字
return s;
};
}
var y=x(); //闭包赋值给y变量
y(4);
y(5);
alert(y(6));
浏览器显示:1,2,3,4,5,6。
结论:function x()事实上是制作了一个只属于代码块环境的闭包,闭包中的s变量是不会因为这个x执行完成后被销毁,也不会因为返回的函数执行完后被销毁,即使这段代码全部执行完,s仍然保留在内存中,作用域链也仍然存在,知道程序结束(关闭浏览器)!所以注意:滥用闭包会导致内存不足的!
为了更好的说明,销毁与不销毁的问题,我推荐下面这段代码
//全局对象y,当中的变量:程序结束前永远不会销毁
//函数中的局部对象在函数结束后也会像变量一样被销毁的
var y={
s:[1,2,3], //对象中的变量
//对象中的方法(类似于函数)
add:function(t){
this.s.push(t);
return this.s;
}
}
y.add(4);
y.add(5);
alert(y.s);
浏览器显示:1,2,3,4,5,6。
结论:用对象和闭包达到同样的效果,因为对象除非指定销毁,不然会存留在当前程序内存中!
使用闭包有一个优点,也是它的缺点,就是可以把局部变量驻留在内存中,可以避免使用全局变量。全局变量在每个模块都可调用,这势必将是灾难性的。
《JavaScript权威指南》学习——js闭包的更多相关文章
- JavaScript 权威指南-学习笔记(一)
本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! ## JavaScript 权威指南-学 ...
- JavaScript权威指南学习笔记6
这两天主要翻看了书中的第18-22章,重点看了第17章:事件化处理,其它几章节主要是翻了下书知道有相关的概念,没有真正理解其中的内容,或者没有考虑究竟如何能把里面的内容应用到实际的项目中.说的讽刺一点 ...
- javascript权威指南学习笔记1
打开这本书,进入到javascript的世界.以前都是看各种视频,感觉什么收获也没有,反而弄得脑袋混乱,希望能够按照这本书的节奏掌握javascript这门语言,为我的前端学习打下基础. 学习前准备: ...
- Javascript权威指南学习笔记
第二章:词法结构 ;function a(){alert(2)};//前面的分号保证正确地语句解析 第三章:类型.值和变量 基本概念: 1.数据类型---能够表示并操作的值的类型叫做数据类型. 2.变 ...
- JavaScript权威指南学习笔记4
今天看了第9.10.11章,感觉收获最大还是正则表达式那章节,不过这些不用太多脑子思考,问题用到了直接查书就可以了,下面分别总结一下: 第9章类和模块:分9节,前面8节都是在讲类相关的知识,最后一节讲 ...
- javascript权威指南学习笔记3
今天看到第四章,记录一下其中的几个点,俗话说:好记性不如烂笔头嘛. 4.9 in运算符和instanceof运算符 in运算符希望它的左操作数是一个字符串或可以转化为字符串,希望它的右操作数是一个 ...
- javascript权威指南学习笔记2
Javascript语言核心(2~12章) 第三章:类型.值.变量 1.数字: overflow(Infinity, -Infinity).underflow(+0,-0) 非数字值:它和任何值都不相 ...
- JavaScript权威指南学习笔记5
下午在杭图回去前看了书中第二部分的13-17章,看的很粗,感觉大部分东西自己已经知道或者平时开发中不会用到,很多章节只是简单的翻了一下,没有仔细思考里面说到的道理,下面对各章节简单的记录下. 第13章 ...
- javascript权威指南第6版学习笔记
javascript权威指南第6版学习笔记 javascript数组.函数是特殊对象 看一点少一点. 3.1.4 hello.js内容是 var x=.3-.2;var y=.2-.1 console ...
随机推荐
- Ef+T4模板实现代码快速生成器
转载请注明地址:http://www.cnblogs.com/cainiaodage/p/4953601.html 效果如图,demo(点击demo可下载案例) 项目结构如图 T4BLL添加BLL.t ...
- Redis构建分布式锁
1.前言 为什么要构建锁呢?因为构建合适的锁可以在高并发下能够保持数据的一致性,即客户端在执行连贯的命令时上锁的数据不会被别的客户端的更改而发生错误.同时还能够保证命令执行的成功率. 看到这里你不禁要 ...
- IOS-验证码的实现和封装(可以直接调用)
最近对OC中的图像比较感兴趣.随手搞得一个类似验证码的demo.直接贴代码了. 小demo中的VerificationCodeView是继承自UIView的,所以需要用到的时候,可以直接定义一个UIV ...
- C++ Primer 5 CH6 函数
6.1 函数基础 函数包括:返回类型.函数名字.形参.函数体. 通过 "调用运算符"(一对圆括号)来执行函数,它作用于一个表达式,该表达式是函数或者指向函数的指针. 函数调用完成两 ...
- JS+CSS实现的下拉刷新/上拉加载插件
闲来无事,写了一个当下比较常见的下拉刷新/上拉加载的jquery插件,代码记录在这里,有兴趣将代码写成插件与npm包可以留言. 体验地址:http://owenliang.github.io/pull ...
- css基本布局
一.一列布局 关键代码: { width:960; margin:0 auto: } 代码: 运行结果: 分析:以上代码实现一列布局,头部占整个浏览器 ...
- C++ 网络爬虫实现
最近有个概念吵得很火,网络爬虫,但是基本都是用什么python或者JAVA写,貌似很少看到用c++写的,我在网上找了一个,看到其实还是很简单的算法 算法讲解:1.遍历资源网站 2.获取html信息 ...
- Maven项目搭建(三):Maven直接部署项目
上一章给大家讲解了如何使用Maven搭建SSM框架项目. 这次给大家介绍一下怎么使用Maven直接部署项目. Maven直接部署项目 1.新建系统变量CATALINA_HOME,值为:Tom ...
- GitLab 客户端添加SSH KEY
一.生成公钥 先查看系统用户目录下是否有 .ssh 文件夹,如果有的话,那说明你之前已经生成过公钥,则可以跳过生成公钥. 运行下面的命令生成一个密钥: ssh-keygen -t rsa -C &qu ...
- 重新认识JavaScript里的创建对象(一)
一.序 面向对象有一个标志,那就是它们都有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.ECMA-262把对象定义为"无序属性的集合,其属性可以包含基本值.对象或者函数&quo ...