js——作用域和闭包

1. js是编译语言,但是它不是提前编译,编译结果不能在分布式系统中移植。大部分情况下,js的编译发生在代码执行前的几微秒(甚至更短)

2. 一般的编译步骤

  • 分词/词法分析:把字符串分解成词法单元
  • 解析/语法分析:将词法单元转换成一个由元素组成的语法结构树,抽象语法树AST
  • 代码生成:将AST转换成一组机器指令

3. 三个工具

  • 引擎:控制整个程序的编译及执行过程
  • 编译器:负责语法分析及代码生成等
  • 作用域:收集并维护所有声明的标识符的访问权限

4. var a = 2 的编译过程

var a=2; --分解成-->
词法单元

var a = 2; =>

var、a、=、2

--解析成-->
树结构

AST


--代码生成-->

1. var a:询问作用域是否有a。

如果有,则忽略。如果没有,则在当前作用域添加一个声明a

2. a = 2:当前作用域是否有a,

如果有,则赋值。如果没有,则向上一层作用域查找

5. 代码生成中查找判断作用域是否存在某个变量的两种查找类型

  LHS RHS
直观区别 变量在=左侧 变量不在=左侧
操作 对变量赋值 取变量的值
找不到?
1. 严格模式

抛出ReferenceError异常

2. 非严格模式

自动隐式创建一个全局变量

抛出ReferenceError异常

6. 作用域

  • 词法作用域

定义在词法阶段的作用域。也就是在写代码时将变量和块作用域写在哪决定的。函数的作用域完全由声明时的位置决定

    • 全局作用域
    • 函数作用域:每声明一个函数就会创建一个作用域。在该作用域内声明的变量或函数(标识符)都附属于它,可在整个函数范围内被使用。
    • 块作用域
var

//变量绑定在所在的函数内
(function c(){
     //a是局部变量,b是全局变量
  var a = b = 3;
})()
(function c(){
     //a和b都是局部变量
  var a = 1, b = 3;
})()

try/catch

try{
  //异常操作
     //catch创建一个块作用域,这里的变量只能在catch中使用
}catch(err){
  //只有这里可以访问err
}

let
ES6新引入的。将变量绑定在所在任意作用域{}中

在循环中for(let i = 1; i < 5; i++),i在每次迭代中会声明,且每次迭代会用上一个迭代结束时的值来初始化

const ES6新引入的,将变量绑定在所在任意作用域{}中,且值是固定不可修改的
  • 运行时修改作用域  eval、with

7. 作用域嵌套

在一个作用域A内创建一个新的作用域B,则B被嵌套在A中

B可以访问A中的标识符。A不可以访问B中的标识符

最外层的作用域是全局作用域

作用域层层嵌套形成作用域链,在访问查找一个标识符时从最内层开始向外查找,一旦找到就停止,因此会出现外层的标识符被内层同名的所屏蔽

8. 闭包

在各个文章中对闭包进行了解释,但是好像有很多说法。我理解得了的一个说法是:

当函数可以记住并访问所在的词法作用域时,就产生了闭包

函数A创建一个作用域A,在A中声明一个函数B(创建了作用域B),把函数B作为结果返回,作用域B会记得自己的作用域链,利用B可以向上层作用域访问

9. 循环和闭包(一个好像特别常见的例子)

for( var i = 1; i <= 5; i++){
    setTimeout(function timer(){
        console.log(i);
    }, i*1000);}

说明:

var i = 1:定义了一个全局变量

setTimeout():在i秒后执行timer函数。timer是回调函数,会在for循环执行完成才会开始调用

结果:for执行完成后开始调用timer,以每秒一次的频率输出5次6

期待:每秒一次输出1,2,3,4,5

结果解释:

setTimeout时并没有让timer保存i的副本

timer函数执行时,会去引用i的值,这时只有一个i=6

修改1——立即执行

for(var i = 1; i <=5; i++){
    (function(){
        setTimeout(function timer(){
            console.log(i);
        }, i*1000);
})();}

结果:以每秒一次的频率输出5次6

即使是立即执行,最后访问的变量也是全局的i

修改2——立即执行+参数

for(var i = 1; i <=5; i++){
    (function(j){
        setTimeout(function timer(){
            console.log(i);
        }, i*1000);
})(i);}

结果:每秒一次输出1,2,3,4,5

修改3——块作用域循环变量

for(let i = 1; i <=5; i++){
    setTimeout(function timer(){
        console.log(i);
    }, i*1000);
}

结果:每秒一次输出1,2,3,4,5

修改4——在循环中添加一个变量var j

for(var i = 1; i <=5; i++){
    var j = i;
    setTimeout(function timer(){
        console.log(j);
    }, j*1000);
}

结果:以每秒一次的频率输出5次5(j和i一样为全局变量,j=5)

修改5——块作用域变量

for(var i = 1; i <=5; i++){
    let j = i;
    setTimeout(function timer(){
        console.log(j);
    }, j*1000);
}

结果:每秒一次输出1,2,3,4,5

参考

1. 《你不知道的javascript》上卷

2. 还看了很多网上的说明,就不一一列举了,因为没记住具体哪些了

时间: 2024-10-14 10:48:06

js——作用域和闭包的相关文章

js系列-3 js作用域与闭包

4,函数作用域中可用arguments来获取函数实参,arguments虽然可以通过下标访问,但它不是数组,原型不是Array.prototype. 它是实参的一个副本,通过arguments可模拟方法的重载.    function add(){        if(arguments.length == 1){           alert(1);        }        if(arguments.length == 2){           alert(2);        }

js 作用域,闭包及其相关知识的总结

面试必问题,闭包是啥有啥子用,觉得自己之前回答的并不好,所以这次复习红皮书的时候总结一下. 提到闭包,相关的知识点比较多,所以先罗列一下要讲的内容. 1. 作用域链,活动对象 2. 关于this对象 3. 垃圾回收机制,内存泄漏 4. 模仿块级作用域,私有变量 涉及的内容这么多,也难怪面试官喜欢问这个问题啊,就像niko大神说的,应该是根据回答的深浅了解你的思维模式吧.废话不多说,开始步入正题. 1. 作用域链,活动对象 活动对象:活动对象就是在函数第一次调用时,创建一个对象,在函数运行期是可变

JS作用域与闭包--实例

//函数作用域 function func(){ var arr = [1,3,5,7,9]; var sum = 0; for(var i = 0,len = arr.length;i < len;i ++){ sum += arr[i]; } console.log("%d\t\n%d",i,sum); } func(); //5 //25 //闭包特性 var outter = []; function clouseTest(){ var arr = ["one&

Js作用域与闭包

在JavaScript中,作用域是执行代码的上下文.作用域有三种类型:全局作用域.局部作用域(或“函数作用域”)和eval作用域. 在函数内部使用var定义的代码,其作用域是局部的. var foo = 0; // 全局作用域 console.log(foo); // 0 var myFunction = function() { console.log(foo); // undefined (下面var foo的声明在此作用域提升) var foo = 1; // 局部作用域 console.

JS中的作用域和闭包

作用域:在编程语言中,作用域控制着变量与参数的可见性及生命周期.JS确实有函数作用域,那意味着定义在函数中的参数和变量在函数外部是不可见的,而且在一个函数中的任何位置定义的变量在该函数中的任何地方都是可见的. var a = 1; var fs = function (){ var b = 2; var c = 4 var fun = function (){ var c = 3; alert(a) //输出1 alert(b) //输出2 alert(c) //输出3 } fun(); } f

js面试题知识点全解(一作用域和闭包)

问题: 1.说一下对变量提升的理解 2.说明this几种不同的使用场景 3.如何理解作用域 4.实际开发中闭包的应用 知识点: js没有块级作用域只有函数和全局作用域,如下代码: if(true){ var name='killua' //把name定义在块里和放在外面是一样的,等同于在外面声明一个变量name,在块内给name赋值 }//同等于下面的代码 //建议用下面方式写 var name if(true){ name='killua' } console.log(name) //打印出来

解析js中作用域、闭包——从一道经典的面试题开始

如何理解js中的作用域,闭包,私有变量,this对象概念呢? 就从一道经典的面试题开始吧! 题目:创建10个<a>标签,点击时候弹出相应的序号 先思考一下,再打开看看 //先思考一下你会怎么写,是不是这样? 可是结果呢,弹出来的都是10,为啥? var i,a for(i=0;i<10;i++){ a=document.createElement('a') a.innerHTML=i+'<br>' a.addEventListener('click',function(eve

我不知道的js(一)作用域与闭包

作用域与闭包 作用域 什么是作用域 作用域就是一套规则,它负责解决(1)将变量存在哪儿?(2)如何找到变量?的问题 作用域工作的前提 谁赋予了作用域的权利?--js引擎 传统编译语言编译的过程 分词/词法分析:字符串 => 词法单元 var a=2; => var a = 2 ;(共5个单元) 解析/语法分析:词法单元流 => 抽象语法树(Abstract syntax tree,AST) 代码的生成: AST => 可执行代码(机器指令) js引擎编译的特点: 代码在执行前进行编

js最基础知识回顾3(字符串拼接,数据类型,变量类型,变量作用域和闭包,运算符,流程控制,)

一.javaScript组成     1.ECMAScript:解释器.翻译 ---------------------------------------------------------几乎没有兼容性问题     2.DOM:Document Object Model --------操作HTML的能力----document--------有一些兼容性问题     3.BOM:Browser Object Model -------------浏览器---------------wind