## 词法作用域

概念：所谓的词法作用域，就是代码在编写过程就体现出来的作用范围。代码一旦写好，不用执行， 作用范围就已经确定好了，这个就是所谓的词法作用域。

## 词法作用域的规则：

1，函数允许访问函数外的数据              （也有就近原则）

2，整个代码结构中只有函数可以限定作用域

3，作用规则首先使用提升规则分析

4，如果当前规则有名字了，则不考虑外面的名字

规则1对应例子：

*******************************************

var num = 123;

function foo() {

console.log(num);

}

foo(); // 123

*******************************************

规则2，3，4对应例子：

***************************************************************************************************************************

var num =123;                                       //1，首先提升num,foo 预解析                                         （规则3）

function foo() {                                      //2，给 num 赋值123；

var num = 456;                                  （函数内部代码执行过程）

function func() {                             //3，函数调用，再预解析 函数内的num（覆盖了外面的num）func

console.log(num);                  //4，赋值num=456

}                                                      //5，执行调用func() ；

func();                                                   //6，打印最近的num，打印456；（console.log(num);）  （规则4）

}

foo(); //456

console.log(num);  //123                        //7，打印函数外部的num=123                                            （规则2）

******************************************************************************************************************************

### 作用域链

概念：只有函数可以制造作用域结构。那么只要有代码，至少有一个作用域，即全局作用域，凡是代码中有函数，那种这个函数就构成了一个作用域链。如果函数中还有函                           数，那么作用域中又有一个作用域，将这样的所有作用域列出来，可以有一个结构：函数内指向函数外的链式结构。

例子：

执行结果1：789

执行结果2：123

#### 绘制作用域链

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="utf-8">
  5.     <title>绘制作用域链 绘制</title>
  6. </head>
  7. <body>
  8.     <script type="text/javascript">
  9.  
  10.         function f1() {
  11.             var num = 123;
  12.             function f2() {
  13.                 console.log(num);
  14.             }
  15.             f2();
  16.         }
  17.         var num =456;
  18.         f1();//123
  19.  
  20.     </script>
  21.  
  22. </body>
  23. </html>

***************************************************************************************************************

### 闭包

目的：想办法间接地获得函数内部数据的使用权。

特点：

具有私有访问数据的 函数的。只有函数内部可以访问的，或者对象的方法。

例如

  1. function person () {
  2.     this.age = 18;
  3. }
  4. //这样的可以被函数外的实例对象所改变。此数据是公开的。

***********************************************************************

一般闭包的使用模式：

1，写一个函数，函数内部定义一个新函数，返回新数据，用新函数获取函数内的数据。

2，写一个函数，函数内定义一个对象，对象中捆绑多个函数（方法），返回对象，利用对象的方法访问函数内的数据。

************************************************************************

1，闭包不允许外部访问。

  1. function foo() {
  2.      var num =123;
  3.      return num;
  4. }
  5. var res = foo();
  6. console.log(res);//123

console.log(foo());//123
console.log(foo());//123

这里每调用一次，创建一次。但是数据不再是相同的一个数据。每调用一次就有一个新的 num = 123 出来了。

2，在函数内的数据，不能直接在函数外被访问，那么在函数内再定义一个函数，那么在这个函数内部中可以被访问        function foo() {

  1.         function foo() {  
             var num =Math.random();
  2.             function fun() {
  3.                 return num;
  4.             }
  5.             return fun;
  6.         }
  7.         // 在函数内的数据，不能直接在函数外被访问，那么在函数内再定义一个函数，那么在这个函数内部中可以被访问的。
  8.         //整个过程只被调用一次
  9.         // 此时返回的是一个函数。访问的是同一个 num
            //函数科粒化（高阶函数）调用：foo()();
  10.         var f = foo();
  11.         var res1 = f();
  12.         var res2 = f();
  13.         console.log(res1);// 0.15312875316801855
  14.         console.log(res2);// 0.15312875316801855
  1.  说明：  // 0级链无法访问一级链里面的数据，所以通过0级链操作二级链，来访问1级链里面的数据

#闭包的性能问题？

函数执行需要内存，那么函数中定义的变量，会在函数执行结束后自动回收，凡是因为闭包结构，被引出的数据，如果还有变量引用这些数据的话，那么这些数据就不会被回收。

闭包比较占内存。

因此在使用闭包的时候如果不使用某些数据了，一定要赋值一个null；

  1. var f = (function () {
  2.      var num = 11;
  3.      return function() {
  4.            renturn num;
  5.      };
  6. })();
  7. //f 引用着函数，函数引用着变量num
  8. //因此在不使用该数据时，最好写上
  9. f = null；

注：个人学习笔记

JS-词法作用域 作用域链的更多相关文章

  1. js词法作用域规则

    function foo() {console.log( a ); // 2不是3} function bar() {var a = 3;foo();} var a = 2;bar(); js中的作用 ...

  2. 第十八篇 js高级知识---作用域链

    一直有想法去写写js方面的东西,我个人是最喜欢js这门语言,喜欢的他的自由和强大,虽然作为脚本语言有很多限制的地方,但也不失为一个好的语言,尤其是在H5出现之后.下面开始说说js的方面的东西,由于自己 ...

  3. 区分词法作用域(js)与动态作用域(精!)

    在js学习中,词法作用域是必须要掌握的! 在这里,我将总结一下<你不知道的JS>一书中词法作用域的重点并分享给大家! 首先带来一段代码示例: function foo(){ console ...

  4. JS详细图解作用域链与闭包

    JS详细图解作用域链与闭包 攻克闭包难题 初学JavaScript的时候,我在学习闭包上,走了很多弯路.而这次重新回过头来对基础知识进行梳理,要讲清楚闭包,也是一个非常大的挑战. 闭包有多重要?如果你 ...

  5. JS中的作用域和作用域链

    本文原链接:https://cloud.tencent.com/developer/article/1403589 前言 作用域(Scope) 1. 什么是作用域 2. 全局作用域和函数作用域 3. ...

  6. js通过沿着作用域链还是原型链查找变量

    这是一道非常典型的JS闭包问题,结果和具体的解析请看这里. 对于其中的`函数作用域链的问题`博主似乎没有解释清楚,有一些疑问:js中的变量到底是沿着作用域链还是原型链查找呢? 首先,要分清作用域链与原 ...

  7. JS基础学习——作用域

    JS基础学习--作用域 什么是作用域 变量的作用域就是变量能被访问到的代码范围,比如在下面的这个js代码中,变量a的作用域就是函数foo,因此在全局作用域内的console.log(a)语句不能访问到 ...

  8. JS面向对象之作用域

    作用域 词法作用域 作用域 域表示的就是范围,即作用范围 就是一个名字在什么地方能使用,在什么地方不能使用 块级作用域 块级别的作用范围 // 在 c , java 等编程语言中,下面的语法报错 { ...

  9. js重点——作用域——作用域分类(三)

    一.作用域可以分为全局作用域,局部作用域(函数作用域)和块级作用域. 1.全局作用域 代码在程序中的任何位置都能被访问到,window对象的内置属性都拥有全局作用域. <script> v ...

  10. JS中的作用域及闭包

    1.JS中的作用域 在 es6 出现之前JS中只有全局作用域和函数作用域,没有块级作用域,即 JS 在函数体内有自己的作用域,但是如果不是在函数体的话就全部都是全局作用域.比如在 if.for 等有 ...

随机推荐

  1. expprt与环境变量

    一.Windows 环境变量 1.在Windows 系统下,很多软件安装都需要配置环境变量,比如 安装 jdk ,如果不配置环境变量,在非软件安装的目录下运行javac 命令,将会报告找不到文件,类似 ...

  2. 第六节: 六类Calander处理六种不同的时间场景

    背景介绍及其使用 该章节主要补充介绍,在前一章四类触发器的基础上配合六大Canlander来动态删减某些时间,来满足更多的应用场景. 1. DailyCalendar:动态排除某天的某些字段. (需求 ...

  3. ArcGis地理坐标系转投影坐标系问题的思考与处理

    博主又不知道标题该咋写了,凑合看吧. 国庆前帮人处理了这样一个问题:Shapefile数据,加载到ArcMap后呈懵逼状态,缩放功能完蛋.求助者希望对数据进行投影,由CGCS2000的GCS坐标系投影 ...

  4. Java设计模式之原型设计模式

    概述 设计模式(Design Pattern)是一套被反复使用.多数人知晓的.经过分类的.代码设计经验的总结. 使用设计模式的目的:为了代码可重用性.让代码更容易被他人理解.保证代码可靠性. 设计模式 ...

  5. MongoDB and GUI 管理界面

    MongoDB https://www.mongodb.com/ MongoDB AtlasDatabase as a Service The best way to deploy, operate, ...

  6. JAVA进阶4

    间歇性混吃等死,持续性踌躇满志系列-------------第4天 1.静态内部类求极值 class MaxMin{ public static class Result{ //表示最大值.最小值 p ...

  7. spring事务源码分析结合mybatis源码(三)

    下面将结合mybatis源码来分析下,这种持久化框架是如何对connection使用,来达到spring事务的控制. 想要在把mybatis跟spring整合都需要这样一个jar包:mybatis-s ...

  8. MySql的事务控制（TCL语言）

    ⒈事务 一个或一组sql语句组成一个执行单元,这个执行单元要么全部执行,要么全部不执行. ⒉事务的特性(ACID) 1.原子性(Atomicity):一个事务不可再分割,要么都执行要么都不执行. 2. ...

  9. js检测数据类型四种办法

    面试题中经常会考js数据类型检测,今天我来分享一下js中常用的四种方法判断数据类型,欢迎指点更正. 废话不多说,直入正题. 1.typeof console.log(typeof "&quo ...

  10. Shell的类型

    1.类Unix系统中有各种shell.如: /bin/bash /bin/csh /bin/ksh /bin/sh /bin/tcsh /bin/zsh 2.在/etc/shells文本文件中可以查看 ...