JavaScript闭包相关知识解析

闭包是JavaScript中的一个难点,同时也是它的特色,JavaScript的很多高级应用都要依靠闭包来实现。以下是我学习闭包的记录,希望对你有些帮助。

变量作用域

在学习闭包之前,我们首先要理解JavaScript不同与其他语言独特的变量作用域。在JavaScript中,不存在局部作用域的概念,但是有全局作用域以及函数作用域。全局作用域与其他语言的相同,没有需要注意的地方,而函数作用域是指函数内部声明的变量在函数外部无法直接访问。

var a = 99;
function f1() {
  console.log(a);
}
f1();

上面的代码中,f1可以读取到全局变量a,而下面的代码中a无法被访问。

function f1() {
  var a = 99;
}
console.log(a);

如何从外部读取函数内部声明的变量?

在某些情况下,我们可能需要得到函数内部的变量,正常情况下是无法做到的,因此需要用特殊的办法。

function f1() {
  var a = 99;
  function f2() {
    console.log(a);
  }
}

上面代码中,我们在函数f1中定义另一个函数f2,这样f1中的所有变量对于f2来说就是可见的,既然f2可以读取到f1中的变量,那么我们只要把f2作为f1的返回值,我们就可以在f1的外部读取到它内部的变量了。

function f1() {
  var a = 99;
  function f2() {
    console.log(a);
  }
  return f2;
}
var result = f1();
result();

此时,就形成了一个简单的闭包。因此,闭包就可以简单的理解为函数中的函数,而本质上,闭包就是一个连接函数内部和外部的桥梁。

闭包的特性

闭包会使得函数中的变量都被保存到内存中。首先我们先看一下以下两个例子

function A() {
  var count = 0;
  function B() {
    count++;
    console.log(count);
  }
  return B;
}
var C = A();
C(); // 1
C(); // 2
C(); // 3

count是函数A中的一个变量,它的值在函数B中被改变,函数B每执行一次,count的值就在原来的基础上累加1,因此,函数A中的count变量会一直保存在内存中。

function A(x) {
  function B(y) {
    console.log(x+y);
  }
return B;
}
var C = A(3);
C(5); //8

当3传入A函数后,B函数就会记住这个值,所以在后面传入5的时候只会对B函数中的y赋值,所以最后会输出8。

使用闭包的注意点

由于上述闭包的特性,每次使用闭包都会大量增加内存的消耗,所以不能滥用闭包,否则会影响网页的性能。我们也可以在函数退出前,使函数内变量指向null来手动删除变量。我们可以来看下一道经典的面试题来理解。

function outer(){
  var num = 0; //内部变量
  return function add() { //通过return返回add函数,就可以在outer函数外访问了
    num++; //内部函数有引用,作为add函数的一部分了
    console.log(num);
  };
}
var func1 = outer();
func1(); //实际上是调用add函数, 输出1
func1(); //输出2 因为outer函数内部的私有作用域会一直被占用
var func2 = outer();
func2(); // 输出1 每次重新引用函数的时候,闭包是全新的。
func2(); // 输出2 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • JS继承与闭包及JS实现继承的三种方式

    前  言 在之前的两篇博客中,我们详细探讨了JavaScript OOP中的各种知识点(JS OOP基础与JS 中This指向详解 . 成员属性.静态属性.原型属性与JS原型链).今天我们来继续探讨剩余的内容吧. 我们都知道,面向对象的三大特征--封装.继承.多态. 封装无非就是属性和方法的私有化,所以我们JS中提供了私有属性和私有方法. 而JS中并没有多态,因此我们说JS是一门基于对象的语言,而非面向对象的语言. 那么,面向对象三大特征中,在JS中最重要的就是继承了. 一.继承的基本概念 使用

  • javascript变量提升和闭包理解

    我们先来看一个题目: <script> console.log(typeof a)//undefined var a='littlebear'; console.log(a)//littlebear </script> <script> console.log(typeof a)//string var a=1; console.log(a)//1 </script> 第一个script里可以看出var a 被提升到顶部,a = 'littlebear'被保

  • JavaScript闭包和回调详解

    一.闭包 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 闭包有三个特性: 1.函数嵌套函数; 2.函数内部可以引用外部的参数和变量; 3.参数和变量不会被垃圾回收机制回收. 闭包是指有权访问另一个函数作用域中的变量的函数,创建闭包的最常见的方式就是在一个函数内创建另一个函数,通过另一个函数访问这个函数的局部变量.使用闭包有一个优点,也是它的缺点,就是可以把局部变量驻留在内存中,可以避免使用全局变量.全局变量在每个模块都可调用,这势必将是

  • JS常见面试试题总结【去重、遍历、闭包、继承等】

    本文实例讲述了JS常见面试试题.分享给大家供大家参考,具体如下: JavaScript面试题总结 1,首先是数组去重算法:给一个数组,去掉重复值 (function() { var arr = [1, 2, 3, 3, 4, ]; function unique() { var result = []; var tem = {}; for (var i = 0; i < arr.length; i++) { if (!tem[arr[i]]) { result.push(arr[i]); tem

  • JS闭包经典实例详解

    本文实例讲述了JS闭包.分享给大家供大家参考,具体如下: 之前花了很多时间看书上对闭包的介绍,也看了很多人的写的关于闭包的博客,然后我就以为自己懂了. 结果,下午在一个QQ群里,有人问了这道经典的闭包问题,如下图: 我告诉他去看书上的闭包介绍.告诉他之后,我想我自己要不也写一下,反正花不了多少时间,结果花了好久怎么写也不对.............. 后来看了看书上的,然后自己总结了下,觉得这次应该懂了.下次还不理解我就可以去跳楼了............ -------------------

  • 通俗易懂地解释JS中的闭包

    1. "闭包就是跨作用域访问变量." [示例一] var name = 'wangxi' function user () { // var name = 'wangxi' function getName () { console.log(name) } getName() } user() // wangxi 在 getName 函数中获取 name,首先在 getName 函数的作用域中查找 name,未找到,进而在 user 函数的作用域中查找,同样未找到,继续向上回溯,发现在

  • js中的闭包实例展示

    前言 准确来说,闭包是基于正常的垃圾回收处理机制下的.也就是说,一般情况一个函数(函数作用域)执行完毕,里面声明的变量会全部释放,被垃圾回收器回收.但闭包利用一个技巧,让作用域里面的变量,在函数执行完之后依旧保存没有被垃圾回收处理掉. 闭包 定义 MDN定义 javascriptkit 词法作用域 闭包的三大特点为: 1.函数嵌套函数 2.内部函数可以访问外部函数的变量 3.参数和变量不会被回收. 作用域链 函数在执行的过程中,先从自己内部找变量如果找不到,再从创建当前函数所在的作用域(词法作用

  • JavaScript闭包相关知识解析

    闭包是JavaScript中的一个难点,同时也是它的特色,JavaScript的很多高级应用都要依靠闭包来实现.以下是我学习闭包的记录,希望对你有些帮助. 变量作用域 在学习闭包之前,我们首先要理解JavaScript不同与其他语言独特的变量作用域.在JavaScript中,不存在局部作用域的概念,但是有全局作用域以及函数作用域.全局作用域与其他语言的相同,没有需要注意的地方,而函数作用域是指函数内部声明的变量在函数外部无法直接访问. var a = 99; function f1() { co

  • javascript闭包概念简单解析(推荐)

    关于"闭包"这个概念的文章在网上铺天盖地,基本已经稀烂了,但是有时候总感觉读了这么多的文章还是云山雾罩,当然是由于它本身就比较难于理解和涉及的知识较多,还有一个很重要的原因就是网上很多教程介绍可能存在一定的误区,或者说侧重点不同,下面就通过代码实例简单的介绍一下什么是闭包. 代码实例一: function a(){ var webName="我们"; console.log(webName); } a() 以上是一段非常简单的代码,当函数执行结束之后,它就会从内存中

  • JavaScript数据类型相关知识详解

    一.字面量 用于表达一个固定值的表示法,又叫做常量. 1.1 数字字面量 <script> // 整数字面量 // 十进制 console.log(12); // 八进制 console.log(010); // 十六进制 console.log(0x100); </script 效果展示 1.2 浮点数字面量 浮点数不区分进制,所有的浮点数都是十进制下的(注意:浮点数若是0~1之间的,前面的0可以省略不写,例如0.6可以写成.6)浮点数的精度远远不如小数. // 浮点数字面量 cons

  • JVM内存结构相关知识解析

    最近在看< JAVA并发编程实践 >这本书,里面涉及到了 Java 内存模型,通过 Java 内存模型顺理成章的来到的 JVM 内存结构,关于 JVM 内存结构的认知还停留在上大学那会的课堂上,一直没有系统的学习这一块的知识,所以这一次我把< 深入理解Java虚拟机JVM高级特性与最佳实践 >.< Java虚拟机规范 Java SE 8版 >这两本书中关于 JVM 内存结构的部分都看了一遍,算是对 JVM 内存结构有了新的认识.JVM 内存结构是指:Java 虚拟机定义

  • Java基于socket编程相关知识解析

    一.网络编程中两个主要的问题 一个是如何准确的定位网络上一台或多台主机,另一个就是找到主机后如何可靠高效的进行数据传输. 在TCP/IP协议中IP层主要负责网络主机的定位,数据传输的路由,由IP地址可以唯一地确定Internet上的一台主机. 而TCP层则提供面向应用的可靠(tcp)的或非可靠(UDP)的数据传输机制,这是网络编程的主要对象,一般不需要关心IP层是如何处理数据的. 目前较为流行的网络编程模型是客户机/服务器(C/S)结构.即通信双方一方作为服务器等待客户提出请求并予以响应.客户则

  • Python解析json文件相关知识学习

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于JavaScript(Standard ECMA-262 3rd Edition - December 1999)的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等).这些特性使JSON成为理想的数据交换语言.易于人阅读和编写,同时也易于机器解析和生成. 今天用pytho

  • JS闭包、作用域链、垃圾回收、内存泄露相关知识小结

    补充: 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 闭包的特性 闭包有三个特性: 1.函数嵌套函数 2.函数内部可以引用外部的参数和变量 3.参数和变量不会被垃圾回收机制回收 闭包的定义及其优缺点 闭包 是指有权访问另一个函数作用域中的变量的函数,创建闭包的最常见的方式就是在一个函数内创建另一个函数,通过另一个函数访问这个函数的局部变量 闭包的缺点就是常驻内存,会增大内存使用量,使用不当很容易造成内存泄露. 闭包是javascript

  • struts2的流程和一系列相关知识代码解析

    1.客户端初始化一个指向servlet容器(Tomcat)的请求: 2.这个请求经过一系列的过滤器,接着FilterDispatcher被调用: 3.FilterDispatcher询问ActionMapper来决定这个请求是否要调用某个action: 4.如果ActionMapper决定调用某个Action,FilterDispatcher把请求的处理交给ActionProxy,ActionPro根据ConfigurationManager询问框架的配置文件,找到需要调用的Action类,一般

  • Java IO流相关知识代码解析

    一.IO流的分类 字符流 Reader InputStreamReader(节点流) BufferedReader(处理流) Writer OutputStreamWriter(节点流) BufferedWriter(处理流) PrintWriter 字节流 InputStream FileInputStream(节点流) BufferedInputStream(处理流) ObjectInputStream(处理流) PrintStream OutputStream FileOutputStre

  • c# 闭包的相关知识以及需要注意的地方

    虽然闭包主要是函数式编程的玩意儿,而C#的最主要特征是面向对象,但是利用委托或lambda表达式,C#也可以写出具有函数式编程风味的代码.同样的,使用委托或者lambda表达式,也可以在C#中使用闭包. 根据WIKI的定义,闭包又称语法闭包或函数闭包,是在函数式编程语言中实现语法绑定的一种技术.闭包在实现上是一个结构体,它存储了一个函数(通常是其入口地址)和一个关联的环境(相当于一个符号查找表).闭包也可以延迟变量的生存周期. 嗯..看定义好像有点迷糊,让我们看看下面的例子吧 class Pro

随机推荐