先来一炮尝尝:

var i = 10;function myFunc(){var i = 20;function innerFunc(){alert(i);}return innerFunc;
}var func = myFunc();func();

  此栗为什么弹出20,而不是10?为什么定义在 myFunc 内部的 innerFunc 返回了以后,还能访问到 myFunc 内部的变量 i ?

  这是因为在 innerFunc 返回了以后,仍然保留着函数运行的实例、执行环境和作用域链等等,并在 myFunc 调用之后没有将函数实例丢弃,因此在调用 innerfunc 的时候能够引用到 myfunc 中声明的 i ,这就是闭包的特性,其实上面的栗子就是一个闭包。

  作用域链是一个链状的数据结构。作用域就是对上下文数据的描述。闭包和作用域链是紧密联系的,函数实例执行时的闭包是构成作用域链的基本元素。javascript代码在执行前会进行语法分析(详见L1 - 运行机制),在语法分析阶段,会记录全局环境中的变量声明和函数定义,构造函数的调用对象(也叫 active object、活动对象)和在全局环境下的作用域链。

  《javascript权威指南》(第四版)对“调用对象”做出了三点说明:

  1、对象属性和变量没有本质区别

  2、全局变量其实是“全局对象(global object)“的属性

  3、局部变量其实是”调用对象(call object)“的属性

  为了解释上述话题,《javascript权威指南》引入了”javascript执行环境(执行上下文、execution context)的概念“。这其中所说到的“全局对象(global object)“和”调用对象(call object)“其实都是指下图中的 ScriptObject 结构。

  上图是《JavaScript语言精髓和编程实践》中对闭包相关元素的内部数据结构的描述,其中的 ScriptObject 是对调用对象的一种描述。 ScriptObject 在语法分析阶段就已经构造好了,其中的 varDecls 保存着函数中的变量声明,funDecls保存着内部的函数声明。

  在上篇《执行机制》中已经讲过,在语法分析阶段,varDecls 中保存着在函数中用var进行显示声明的局部变量,并且其值默认为 undefined ;而发现有函数定义时,除了记录函数声明,还会创建一个函数对象,并把当前的作用域链赋值给此函数对象的 [[scope]] 属性(这个属性是javascript引擎内部维护的,但Firefox可通过私有属性parent访问它)。这就是为什么在《javascript权威指南》中提到”javascript中的函数运行在它们被定义的作用域中,而不是运行在它们被执行的作用域中“。

  再来一炮:(未完待续)

转载于:https://www.cnblogs.com/kuangliu/p/4054750.html

L1 - 闭包和原型链相关推荐

  1. 前端开发之闭包、继承、原型链

    闭包.原型链和继承 闭包 闭包的概念 官方对闭包的解释是:一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分. 闭包是指有权访问另一个函数作用域中的变量 ...

  2. js的作用域链,原型链,以及闭包函数理解

    代码一: this.number = 10 function a() {this.number = 20 } a.prototype.init = () => console.log(this. ...

  3. js原型、原型链、作用链、闭包全解

    https://www.2cto.com/kf/201711/698876.html [对象.变量] 一个对象就是一个类,可以理解为一个物体的标准化定义.它不是一个具体的实物,只是一个标准.而通过对象 ...

  4. javascript中实例对象和构造函数关系、原型语法、原型链、call实现继承、apply调用函数、bind拷贝函数、拷贝继承、class类、super、严格模式、高阶函数、闭包、递归、es6简介

    实例对象和构造函数的关系及原型: 实例对象是通过构造函数创建出来的,实例对象的构造器constructor就是指向构造函数的:每个实例对象中的同一方法的指向是各不相同的,但是其属性值相同的属性可以相同 ...

  5. JavaScript学习(五十九)—原型、原型链、闭包以及闭包的不足

    JavaScript学习(五十九)-原型.原型链.闭包以及闭包的不足 一.什么是闭包? 所谓闭包就是指被定义在其他函数内部的函数. 闭包函数可以访问它所在的函数的所有变量. 文字太抽象了,画图解释一下 ...

  6. 原型 继承 原型链 闭包

    javascript继承的 6 种方法 原型链继承 借用构造函数继承 组合继承(原型+借用构造) 原型式继承 寄生式继承 寄生组合式继承 说一下你对原型与原型链的了解度,有几种方式可以实现继承,用原型 ...

  7. JavaScript中的经典题型(类数组、CSS Sprites、事件委托、经典去重、原型链、闭包、深浅克隆、附带思路流程和源码)

    JavaScript中的经典题型 一.JavaScript中的经典题型 1..如何判断一个数组和类数组? 首先要明白什么是类数组. 类数组:类数组是一个普通对象,他的原型是Object.而真实的数组是 ...

  8. JavaScript高级第2天:定义函数的三种方式、函数的原型链结构、完整原型链、作用域以及作用域链、函数的四种调用模式、闭包、计数器、斐波那契数列优化、三种继承方式

    JavaScript高级第二天 01-定义函数的三种方式 1.函数声明 function:可以先调用再声明,因为预解析(把函数声明.变量声明进行提升) function fn() {//函数体conl ...

  9. web前端面试高频考点——JavaScript 篇(一)【JS的三座大山 】 原型和原型链、作用域和闭包、异步

    系列文章目录 JavaScript 知识梳理,收录了web前端面试 95%以上 的高频考点,满满的干货.给你做一个高效的知识梳理,为你的面试保驾护航! 内容 参考链接 HTML & CSS 篇 ...

最新文章

  1. spring之DelegatingFilterProxy
  2. C#图片压缩的实现方法
  3. mysql 不排序_第08期:有关 MySQL 字符集的注意事项
  4. Castle.MircoKernel Class Diagram - Part I
  5. MFC下列表控件的使用
  6. linux学习一天一个命令(4)[mkdir命令]
  7. 错误: -source 1.6 中不支持 diamond 运算符
  8. stosb, stosw, stosd 汇编指令
  9. 大学生体育运动网页设计模板代码 校园篮球网页作业成品 学校篮球网页制作模板 学生简单体育运动网站设计成品...
  10. 传统蒙文字体_蒙文字体下载
  11. win10桌面mac化保姆级教程[干货] 小白也能拥有的简(酷)约(炫)实用桌面
  12. go语言:sync.Once的用法(转)
  13. 查看微信小程序的累计独立访客(UV)
  14. android wifi分享文件下载,WiFi文件共享
  15. win10下载文件夹变成英文了该怎么办?下载文件夹变成英文的修复方法
  16. 测试显卡显存以及tensorflowGPU
  17. 三角形形状判断(等边、等腰、直角、等腰直角、非等边)
  18. Windows搭建FTP服务器,JAVA实现读写功能
  19. HTTP 最强资料大全
  20. 【calendar日历组件】elementul的日历组件点击拿到对应的日期或者触发某些事件

热门文章

  1. java输出5行星型三角_JAVA图形小动画之简单行星运动
  2. SQL注入如何进行攻击
  3. python学习--关注容易被忽略的知识点---(一)python基础
  4. UML基础: 统一建模语言简介
  5. Android 偶见花屏 bug,无法手动重现
  6. animate inater插件_基于animate.css动画库的全屏滚动小插件,适用于vue.js(移动端、pc)项目...
  7. JAVA基础之列表(list)和字典(dict)
  8. C#正则表达式——网游角色起名仅允许汉字、字母、数字、底划线
  9. jQuery Mobile 高级设计模板
  10. .NET中加密和解密的实现方法