【前端知识之JS】JS的作用域链
前言
本系列主要整理前端面试中需要掌握的知识点。本节介绍JS的作用域链。
文章目录
- 前言
- 一、作用域
- 1. 全局作用域
- 2. 函数作用域
- 3. 块级作用域
- 二、词法作用域
- 三、作用域链
一、作用域
作用域就是变量和函数生效的区域或集合,即作用域决定了代码区块中变量和其他资源的可见性
1. 全局作用域
任何不在函数中或是大括号中声明的变量,都会在全局作用域下,全局作用域下声明的变量可以在程序的任意位置访问。
// 全局变量
var greeting = 'Hello World!';
function greet() {console.log(greeting);
}
// 打印 'Hello World!'
greet();
2. 函数作用域
函数作用域也叫局部作用域,如果一个变量是在函数内部声明的他就在一个函数的作用域下面。这些变量只能在函数内部访问,不能在函数以外去访问。
function greet() {var greeting = 'Hello World!';console.log(greeting);
}
// 打印 'Hello World!'
greet();
// 报错: Uncaught ReferenceError: greeting is not defined
console.log(greeting);
3. 块级作用域
ES6引入了let和const关键字,和var关键字不同,在大括号中使用let和const声明的变量存在于块级作用域中。在大括号之外不能访问这些变量。
{// 块级作用域中的变量let greeting = 'Hello World!';var lang = 'English';console.log(greeting); // Prints 'Hello World!'
}
// 变量 'English'
console.log(lang);
// 报错:Uncaught ReferenceError: greeting is not defined
console.log(greeting);
二、词法作用域
词法作用域,又叫静态作用域,变量被创建时就确定好了,而非执行阶段确定的。也就是说我们写好代码时它的作用域就确定了,JavaScript 遵循的就是词法作用域
var a = 2;
function foo(){console.log(a)
}
function bar(){var a = 3;foo();
}
bar();
上述代码变成下图:
由于JavaScript遵循词法作用域,相同层级的 foo 和 bar 就没有办法访问到彼此块作用域中的变量,所以输出2。
三、作用域链
当在Javascript中使用一个变量的时候,首先Javascript引擎会尝试在当前作用域下去寻找该变量,如果没找到,再到它的上层作用域寻找,以此类推直到找到该变量或是已经到了全局作用域。
如果在全局作用域里仍然找不到该变量,它就会在全局范围内隐式声明该变量(非严格模式下)或是直接报错。
【前端知识之JS】JS的作用域链相关推荐
- JS - 自由变量与作用域链
先解释一下什么是"自由变量". 在A作用域中使用的变量x,却没有在A作用域中声明(即在其他作用域中声明的),对于A作用域来说,x就是一个自由变量.如下图 如上程序中,在调用fn() ...
- 「JavaScript灵魂之问」前端知识梳理之 JS 篇(中篇)
对象基础 对象前置知识 /* 对象基础知识 */var teacher = {name: '张三',age: 32,sex: 'male',height: 176,weight: 130,teach: ...
- WEB前端学习二 JS作用域和作用域链
先上三段说明作用域的代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 3 ...
- 【JS】原始值与引用值、执行上下文与作用域链、作用域链增强、变量声明、标识符查找
1.原始值与引用值 EcmaScript变量可以包含两种不同类型的数据:原始值.引用值 原始值:最简单的数据 引用值:由多个值构成的对象 六种原始值: Undefined Null Boolean N ...
- JavaScript之作用域链
本文共 1200 字,读完只需 4 分钟 概述 JavaScript 中的可执行代码有其执行上下文,在执行上下文中,有三个重要的元素: 变量对象(variable object) 作用域链(scope ...
- Javascript 进阶 作用域 作用域链
一直觉得Js很强大,由于长期不写js代码,最近刚好温故温故. 1.Javascript没有代码块作用域的概念,局部作用域是针对函数来说的. [javascript] view plaincopy fu ...
- javaScript变量、作用域链
变量 JavaScript 变量松散类型的本质,决定了它只是在特定时间用于保存特定值的一个名字而已. 变量分为基础类型值和引用类型值: 基本类型值指的是 简单的数据段(Undefined.Null.B ...
- 前端知识总结汇总!(HTML、CSS、JS、jQuery、vue、微信小程序)
前端知识总结汇总!(HTML.CSS.JS.jQuery.vue.微信小程序) 前端理论考核题 1 / HTML 1.DOCTYPE 的作用是什么?标准模式与兼容模式各有什么区别? !DOCTYPE是 ...
- JavaScript学习笔记——JS中的变量复制、参数传递和作用域链
今天在看书的过程中,又发现了自己目前对Javascript存在的一个知识模糊点:JS的作用域链,所以就通过查资料看书对作用域链相关的内容进行了学习.今天学习笔记主要有这样几个关键字:变量.参数传递.执 ...
- JS 总结之函数、作用域链
在 JavaScript 中,函数实际上是一个对象. ? 声明 JavaScript 用 function 关键字来声明一个函数: function fn () {} 复制代码 变体:函数表达式: v ...
最新文章
- laravel cookie加密解密原理
- wdlinux 安装apc扩展
- 零基础学前端之css3高级特效
- [CodeForces 1603C] Extreme Extension(贪心 + 数论分块优化dp)
- 一个文章表的 MySQL 索引怎么建立合理
- 信息学奥赛一本通(1102:与指定数字相同的数的个数)
- JSP:src路径里有中文,产生乱码问题
- 官方晒一加8系列旗舰关键配置:号称更极致的屏幕机皇
- IDEA控制台乱码终极解决方案
- 学习STM32 RS485 原理与应用
- 特征选择+++分裂大法好
- JavaEE 13个核心规范
- 视频转换器怎么将ogv格式转换成mp4
- ROS话题通信c++和python实现
- python培训班大概多少钱
- 【LaTex】第二行作者居中(IEEEtran模板)
- 【Windows 问题系列第 2 篇】如何让显示的窗口在桌面的最上面,而不被其它窗口遮挡?
- SQL学习笔记(三): 视图与一些复杂查询(虽复杂但常用)
- python3函数的参数:必选参数(位置参数)、默认参数、可变参数、关键字参数、命名关键字参数
- 【初始C语言】——(5)
热门文章
- php怎么获得今天的日期,PHP怎么获取今天、昨天、明天的日期-php教程
- html5 元宵节送祝福,[元宵节祝福语简短5]元宵节祝福语简短
- Learning Convolutional Neural Network for Graphs
- 发送短信验证码及调用短信接口与C# 后台 post 发送
- 快递鸟即时查询(PHP)
- 梧桐树定制福满满养老年金,给你养老生活源源不断的现金流!
- 面向对象技术之——转发(forwarding)
- 落花人独立 微雨燕双飞
- wifi上行下行速度测试_怎么测试上行速度,直观的测试 WiFi上下行宽带
- 网络基础知识 -It is a rough road that leads to the heights of greatness. 崎岖不平的道路将通往伟大崇高之地。