[label][JavaScript]闭包阅读笔记
原文链接来源:
当嵌套函数在被嵌套函数之外调用的时候,就形成了闭包。 (By nowmagic)
// 函数内部可以直接读取全局变量
var n = 999;
function f1() {
alert(n);
}
f1(); // 999
// 函数外部无法读取函数内部的变量,主义函数内部声明变量的时候,一定要使用var。
// 如果不用,则相当于声明了一个全局变量。
function f2() {
var n = 999;
}
alert(n);
// FF: ReferenceError: n is not defined
// Chrome: Uncaught ReferenceError: n is not defined
// IE8: n is undefined
// 如果函数内部不使用var来声明变量,那么相当于声明了一个全局变量。
function f3() {
n = 999;
}
f3(); //
alert(n);
// 不声明全局变量,我们要如何才能读取函数内部的变量呢?
// 一个变通的方法就是,在函数的内部,再定义一个函数。
function f4() {
var n = 999;
function f5() {
alert(n); // 999
}
f5();
}
f4();
/*
函数f5就被包括在函数f4内部,这时f4内部的所有局部变来那个,对f5都是可见的。但是反过来就不行,f5内部的局部变量,对f4是不可见的。这就是JavaScript语言特有的“链式作用域”结构(chain scope),子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
*/
// 既然f5可以读取f4中的局部变量,那么只要把f5作为返回值,我们不就可以在f4外部读取它的内部变量了吗?
function f4() {
var n = 999;
function f5() {
alert(n);
}
return f5;
}
var result = f4();
result();
// 上面代码中的f5函数,就是闭包。
// 闭包就是能够读取其他函数内部变量的函数。
// 由于在JavaScript语言中,只有函数内部的字函数才能读取局部变量,因此可以把闭包简单理解成“定义在一个函数内部的函数”。
// 所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
// 闭包的最大用途,一个是可以读取函数内部的变量,另一个是让这些变量的值始终保存在内存中。
function f6() {
var n = 999;
nAdd = function() {
n+=1;
console.log(this);// Object window
};
function f7(){
alert(n);
console.log(this); // Object window
}
return f7;
}
var result = f6();
result(); // 999
nAdd();
result(); // 1000
// result实际上就是闭包函数f7,它一共运行两次,第一次的值为999,第二次的值是1000。这证明了,函数f6中的局部变量n
// 一直保存在内存中,并没有在f1调用结束后被自动清除。
// 为什么会这样呢?原因在于f6是f7的父函数,而f7被赋值给一个全局变量,这导致f7始终在内存中,而f7的存在依赖于f6,因此
// f6也始终在内存中,不会在调用结束后,被垃圾回收机制(garbage collection)回收。
// JavaScript垃圾回收机制(garbage collection)规则就是:不会再被对象调用的。
// nAdd前面没有使用var关键字,因此nAdd是一个全局变量,而不是局部变量。其次,nAdd的值
//是一个匿名函数(anonymous function),这个函数本身也是一个闭包。
// nAdd的作用相当于一个setter,可以在函数外部对函数内部的变量进行操作。
// 使用闭包的注意点:
// 1. 函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用,解决办法是,在退出函数之前,将不使用的局部变量全部删除。
// 2. 闭包会在父函数外部,改变父函数内部变量的值。如果把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method)
// 把内部变来那个当作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值。
var name = 'The Window';
var obj = {
name: 'My Object',
getNameFunc: function() {
return function() {
return this.name;
}
}
}
alert(obj.getNameFunc()());
// 调用getNameFun方法对象是obj,返回匿名函数(anonymous function)作为一个
// 全局变量,它的调用对象是window,所以输出为 "The Window"
var name = 'The Window';
var obj = {
name: 'My Object',
getNameFunc: function() {
var that = this;
return function() {
return that.name;
}
}
}
alert(obj.getNameFunc()()); // Output: My Object
[label][JavaScript]闭包阅读笔记的更多相关文章
- JavaScript闭包学习笔记
此文都是大牛们关于闭包的观点,在此只是总结. 闭包应用的两种情况即可——函数作为返回值,函数作为参数传递. 1 深入理解javascript原型和闭包 判断一个变量是不是对象非常简单.值类型的类型判断 ...
- <<Javascript Patterns>>阅读笔记 -- 第2章 基本技巧(一)
第一次写这种东西, 有些生涩和蹩脚, 也是为了自己在表达或是总结方面有所提高, 同时为看过的东西留个痕迹, 以便日后查阅. 有错误或是不妥的地方, 还望各位指正, 谢谢! 第1章 简介 本章主要介绍了 ...
- <<Javascript Patterns>>阅读笔记 -- 第2章 基本技巧(二)
关于for-in循环 循环数据时, 强烈不推荐使用for-in循环.因为当Array对象被扩展后, 再用for-in循环遍历数据会导致逻辑上的错误, 举例说明: var arr = ['a', 'b' ...
- <<Javascript Patterns>>阅读笔记 – 第3章 字面量和构造函数
对象字面量 首先给出对象字面量的定义语法: 1. 将对象定义在一对括号中(左大括号“{”和右大括号”}”) 2. 对象中以逗号分隔属性和方法. 每个属性或方法以key-value的形式出现, key和 ...
- javascript高级程序设计阅读笔记(一)
javascript高级程序设计阅读笔记(一) 工作之余开发些web应用作为兴趣,在交互方面需要掌握javascript和css.HTML5等技术,因此读书笔记是必要的. javascript简介 J ...
- JavaScript高级程序设计 - 阅读笔记
[本博客为原创:http://www.cnblogs.com/HeavenBin/] 前言: 大致花费了一个星期的时间把这本书认真看了半本,下面是我做的阅读笔记,希望能够让看这本书的人有个大致的参考. ...
- 阅读笔记《JavaScript语言精粹》
阅读笔记<JavaScript语言精粹> 对象 1.检索属性 使用[]和. 2.引用传递 JavaScript的简单数据类型包括数字.字符串.布尔值.null值和undefined值.其它 ...
- 昼猫笔记 JavaScript -- 闭包
本次主要内容是 闭包 阅读时间: 约 3分钟 记得点个赞支持支持我哦 初步了解 先看下代码,输出结果是多少? function fn1 () { var a = 2 function fn2 () ...
- javascript闭包获取table中tr的索引 分类: JavaScript 2015-05-04 15:10 793人阅读 评论(0) 收藏
使用javascript闭包获取table标签中tr的索引 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...
随机推荐
- 黄聪:如何配置Emeditor实现代码智能识别自动完成功能
设置方法如图所示: 效果如下图所示:
- TCL数据类型
原始数据类型在Tcl中是字符串,我们常常可以找到字符串和引用在Tcl语言中.这些原始数据类型依次创建复合数据类型列表和关联数组.在Tcl中,数据类型可以表示不仅是简单Tcl的对象,但也可以代表相同的句 ...
- 华为5573+联通4G上网SIM+ROS hap ac-RB962UiGS-5HacT2HnT 上网
华为5573+联通4G上网SIM+ROS hap ac-RB962UiGS-5HacT2HnT 上网 原理其实是这样的,ROS的USB口连接华为5573: 华为5573看成是一个路由器,他的外网网卡走 ...
- 【Codeforces】Codeforces Round #491 (Div. 2) (Contest 991)
题目 传送门:QWQ A:A - If at first you don't succeed... 分析: 按照题意模拟 代码: #include <bits/stdc++.h> usin ...
- webdriver定位页面元素时使用set_page_load_time()和JavaScript停止页面加载
webdriver定位页面元素时使用set_page_load_time()和JavaScript停止页面加载 原文:https://my.oschina.net/u/2344787/blog/400 ...
- JDK动态代理代码示例
JDK动态代理代码示例 业务接口 实现了业务接口的业务类 实现了InvocationHandler接口的handler代理类 1.业务接口 package com.wzq.demo01; /** * ...
- window.location 属性
属性 含义 值 protocol: 协议 "http:" hostname: 服务器的名字 "b.a.com" port: 端口 "88" ...
- uvalive 7299 Boggle
Boggle is a game in which 16 dice with letters on each side are placed into a 4 × 4 grid. Players th ...
- java.util.ConcurrentModificationException异常分析
Java在操作ArrayList.HashMap.TreeMap等容器类时,遇到了java.util.ConcurrentModificationException异常.以ArrayList为例,如下 ...
- JAXB--@XmlElementWrapper注解(二)
在JAXB标准中,@XmlElementWrapper注解表示生成一个包装 XML 表示形式的包装器元素. 此元素主要用于生成一个包装集合的包装器 XML 元素.因此,该注释支持以下两种形式的序列化. ...