js 闭包 理解

1.什么是闭包

定义:是指有权访问另一个函数作用域中的变量的函数

创建闭包:在一个函数内部创建另一个函数

基本特点 在返回的匿名函数中 可以调用外部函数的变量 如下例中所示 内部函数(匿名函数) 可以访问外部函数的变量num 形式如a[num] 原因是匿名函数作用域链中包括外部函数test1的作用域

闭包有权访问包含函数内部的所有变量 如下面的 外部函数定义变量d 在闭包中可以直接访问到d (var dd=d)

 function test1(num){         var d;

        return function(a,b){
            var d1=a[num],d2=b[num];           var dd=d;  }

    }

实例参考 此时点击产品1 到 产品4 结果都是5 点击匿名函数的作用域链中包括外部函数init的活动对象 都是引用的同一个变量i 都是5 。解决办法 返回的匿名函数 通过立即执行函数 把参数i传给匿名函数

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8" />
    <title>闭包演示</title>
    <style type="text/css">
        p {background:gold;}
    </style>
    <script type="text/javascript">
        function init() {
            var pAry = document.getElementsByTagName("p");
            for( var i=0; i<pAry.length; i++ ) {
                pAry[i].onclick = function() {
                    alert(i);
                }
            }
        }

    </script>
</head>
<body >
<p>产品 0</p>
<p>产品 1</p>
<p>产品 2</p>
<p>产品 3</p>
<p>产品 4</p>
</body>
</html>

 弹出结果都是5截图 

解决办法:立即执行匿名函数 参数i是循环i的值 传递给num形参 匿名函数里 在创建闭包 可以访问这个传递过来的值num

pAry[i].onclick = function(num){//......}(i)

  

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8" />
    <title>闭包演示</title>
    <style type="text/css">
        p {background:gold;}
    </style>
    <script type="text/javascript">
          /*修改后*/
          function init() {
         var pAry = document.getElementsByTagName("p");
         for( var i=0; i<pAry.length; i++ ) {
         pAry[i].onclick = function(num) {

         return function(){
         alert(num)
         }
         }(i)
         }
         }

    </script>
</head>
<body >
<p>产品 0</p>
<p>产品 1</p>
<p>产品 2</p>
<p>产品 3</p>
<p>产品 4</p>
</body>
</html>

  结果点击第一展示

1.1 闭包的原理

-1) 闭包的作用域链 包括 闭包自身的作用域(一般返回匿名函数的作用域),外部函数的作用域(包含的外部函数),全局作用域

-2)通常,函数的作用域和所有变量都会在函数执行结束后被销毁

-3)函数返回一个闭包,这个函数的作用域会一直保存在内存中直到闭包不存在为止

使用闭包可以模仿块级作用域

-1)创建闭包并立即执行这个函数 不会再内存中留下该函数的引用

-2 )结果 函数内部的所有变量都会被立即销毁

2.什么是作用域链


执行环境:定义了变量或函数有权访问其他数据,决定它们各自的行为。

变量对象:每个执行环境都有一个与之关联的变量对象。

执行环境定义的所有变量和函数都保存在变量对象中。编写代码无法访问这个对象,解析器在处理数据时会在后台使用它。

-1)全局执行环境是最外围的一个执行环境

-2)web浏览器中,全局执行环境默认是window对象,因此所有全局变量和函数都是作为window对象的属性和方法创建的

-3)某个执行环境中的所有代码执行完毕后,该环境被销毁,保存在其中的所有变量和函数定义都随之销毁  全局执行环境直到应用程序退出--例如关闭网页或浏览器时才会被销毁

-4)每个函数都有自己的执行环境

作用域链:当代码在一个执行环境中执行时,会创建变量对象 一个作用域链

作用域链用途:保证对执行环境有权访问的所有变量和函数的有序访问

标识符解析:沿着作用域链一级一级的向上搜索标识符的过程。

函数参数也被当做变量来看待,因此访问规则与执行环境中的其它变量相同。 例子:下面函数chageColor(num){} 在闭包里tempColor(a){}里可用a[num]访问

实例解析

<script type="text/javascript">
    /*全局变量*/
    var color = ‘red‘ ;

    function changeColor(num){
        var otherColor = ‘blue‘,
            another =color,
         chage = changeColor();

            function tempColor(a){
                  var temp = otherColor,
                      temp2 = color,
                      temp3 = changeColor();/*这里可以访问上层执行环境otherColor another chage 和全局color*/
                  var u =a[num];

            }

    }
</script>

  

  

  全局 window

|

|-------------color 全局变量

|------------changeColor()

|

|---------------otherColor(局部变量 还有两个就是调用的上层全局环境里的color变量和函数chageColor)

|---------------tempColor()

|-------------------h(变量h不能被上层执行环境调用 只能在tempColor()里调用 标识符向上搜索沿着作用域链 这个环境里可以调用外层环境和全局环境的变量)

时间: 2024-11-05 15:52:35

js 闭包 理解的相关文章

JS闭包理解

Js闭包理解 在很多面试题中都会问什么是js的闭包,为什么需要使用闭包,使用闭包的优缺点! 我在面试其他人的时候也喜欢问这个问题,回答的也是千奇百怪,现在就总结一下我对闭包的理解. 闭包是一种概念,这种概念比较复杂,很多地方的定义不尽相同,我的理解是:闭包是能读取函数内部变量的函数,也就是定义在函数内部的函数,成为函数内部元素与外部沟通的桥梁. 闭包的概念是有js的链式作用域引出来的,所谓链式作用域就是指:内部函数可以读取到所有的外部变量,而外部变量或者函数不能读取到函数的内部变量,变量的作用域

JS闭包理解_摘

原文地址1:http://www.cnblogs.com/mzwr1982/archive/2012/05/20/2509295.html 闭包是一个比较抽象的概念,尤其是对js新手来说.书上的解释实在是比较晦涩,对我来说也是一样. 但是他也是js能力提升中无法绕过的一环,几乎每次面试必问的问题,因为在回答的时候.你的答案的深度,对术语的理解以及js内部解释器的运作方式的描述,都是可以看出你js实际水平的.即使你没答对,也能让考官对你的水平有个评估.那么我先来说说我对js中的闭包的理解. 闭包是

js 闭包 理解 copy

闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 下面就是我的学习笔记,对于Javascript初学者应该是很有用的. 一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量. var n=999; function f1(){ alert(n); } f1(); // 999 另一方面,在函数外

js闭包(closure),个人理解

一.闭包概念理解 各种专业文献上对js"闭包"(closure)定义非常抽象,贼难看懂.我的理解是,闭包就是能够读取某函数内部变量的函数.由于在Javascript语言中只有在函数内部的函数才能读取局部变量,因此可以把闭包简单理解成"定义在一个函数内部的函数".所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁. 二.用途 闭包可以用在很多地方.但它最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中. 三.使

理解js闭包原理

各种专业文献上的"闭包"(closure)定义非常抽象,很难看懂.我的理解是,闭包就是能够读取其他函数内部变量的函数. 由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成"定义在一个函数内部的函数". 所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁. 闭包可以用在许多地方.它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中. 怎么来理解这句话呢?请看下面的

个人对js闭包的理解

闭包算是前端面试的基础题,但我看了很多关于闭包的文章博客,但感觉很多对于闭包的理想还是有分歧的,现在网上对闭包的理解一般是两种: 有些文章认为闭包必须要返回嵌套函数中里面用到外面函数局部变量的方法才叫闭包,有两个条件:1).函数嵌套,内部函数要用到外部函数的局部变量 2).内部函数必须返回 有些文章认为只要函数嵌套内部函数用到了外部局部变量就是闭包,不要返回内部函数 我们先看看闭包的定义到底是什么,然后在来分析我在学习js的时候不同阶段对闭包的误解.在<javascript高级程序设计中>对闭

(原创)JS闭包看代码理解

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JS闭包</title> <script type="text/javascript" src="

javascript深入理解js闭包(看了挺多的,感觉这篇比较透彻)

闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量. Js代码 var n=999; function f1(){ alert(n); } f1(); // 999 另一方面,在函数外部自然无法读取函数内的局部变量. Js代码 function

JS闭包的深入理解

1. javascript 语言的闭包理解 js的变量以作用域划分为两种:全局变量.局部变量.在函数外声明的变量为全局变量,函数内部可以直接调用全局变量.在函数内部声明变量一定要用var 命令,否则就是在函数内部声明了一个全局变量了. 闭包的产生是为了从外部读取函数的局部变量,即在函数内部再定义一个函数f2,把f2作为返回值,在上层函数中返回就可以使上层函数读取其他函数的局部变量了. function f1(){ n=999; function f2(){ alert(n); } return