浅谈JavaScript作用域


Posted in Javascript onDecember 06, 2021

一、作用域

通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突。

JavaScript(es6前)中的作用域有两种:

  • 全局作用域
  • 局部作用域(函数作用域)
  • 在ES6后,还有一个块级作用域,以后在详述。

1、全局作用域

作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件。

2、局部作用域

作用于函数内的代码环境,就是局部作用域。 因为跟函数有关系,所以也称为函数作用域。

例如:

for(let i=0;i<100;i++){
       sum += i;
   }

二、变量的作用域

在JavaScript中,根据作用域的不同,变量可以分为两种:

  • 全局变量
  • 局部变量

1、全局变量

在全局作用域下声明的变量叫做全局变量(在函数外部定义的变量)。
全局变量在代码的任何位置都可以使用
在全局作用域下 var 声明的变量 是全局变量
特殊情况下,在函数内不使用 var 声明的变量也是全局变量(不建议使用)

2、局部变量

在局部作用域下声明的变量叫做局部变量(在函数内部定义的变量)
局部变量只能在该函数内部使用
在函数内部 var 声明的变量是局部变量
函数的形参实际上就是局部变量

3、全局变量和局部变量的区别

  • 全局变量:在任何一个地方都可以使用,只有在浏览器关闭时才会被销毁,因此比较占内存。
  • 局部变量:只在函数内部使用,当其所在的代码块被执行时,会被初始化;当代码块运行结束后,就会被销毁,因此更节省内存空间。

三、作用域链

根据在内部函数可以访问外部函数变量的这种机制,用链式查找决定哪些数据能被内部函数访问,就称作作用域链

  • 只要是代码,就至少有一个作用域
  • 写在函数内部的局部作用域
  • 如果函数中还有函数,那么在这个作用域中就又可以诞生一个作用域

例如:对下面的代码进行分析判断结果是几

function f1() {
    var num = 123;
    function f2() {
        console.log( num );
    }
    f2();
}
var num = 456;
f1();

分析如下图所示:

浅谈JavaScript作用域

可知最终的结果为:123

同样,也可以采取就近原则的方式来查找变量最终的值。

到此这篇关于JavaScript作用域详情介绍的文章就介绍到这了,更多相关JavaScript作用域内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
js 图片轮播(5张图片)
Dec 30 Javascript
jquery ajax提交表单数据的两种实现方法
Apr 29 Javascript
JQuery为页面Dom元素绑定事件及解除绑定方法
Apr 23 Javascript
JS使用ajax从xml文件动态获取数据显示的方法
Mar 24 Javascript
浅析AngularJS中的指令
Mar 20 Javascript
基于jQuery实现音乐播放试听列表
Apr 14 Javascript
javascript 判断是否是微信浏览器的方法
Oct 09 Javascript
js实现带简单弹性运动的导航条
Feb 22 Javascript
巧用weui.topTips验证数据的实例
Apr 17 Javascript
vue.js系列中的vue-fontawesome使用
Feb 10 Javascript
微信小程序实现文字跑马灯
May 26 Javascript
工作中常用js功能汇总
Nov 07 Javascript
JavaScript流程控制(循环)
Dec 06 #Javascript
JavaScript流程控制(分支)
Dec 06 #Javascript
JavaScript实现队列结构过程
Dec 06 #Javascript
JavaScript实现栈结构详细过程
Dec 06 #Javascript
JavaScript实现优先级队列
Dec 06 #Javascript
JavaScript阻止事件冒泡的方法
Dec 06 #Javascript
JavaScript执行机制详细介绍
You might like
PHP 采集程序原理分析篇
2010/03/05 PHP
关于Javascript模块化和命名空间管理的问题说明
2010/12/06 Javascript
jQuery登陆判断简单实现代码
2013/04/21 Javascript
JavaScript 和 Java 的区别浅析
2013/07/31 Javascript
JS获取url链接字符串 location.href
2013/12/23 Javascript
浅谈Javascript中匀速运动的停止条件
2014/12/19 Javascript
jQuery实现炫酷的鼠标轨迹特效
2015/02/01 Javascript
7个jQuery最佳实践
2016/01/12 Javascript
JS实现HTML标签转义及反转义
2020/04/14 Javascript
微信小程序 数据交互与渲染实例详解
2017/01/21 Javascript
Angular.JS去掉访问路径URL中的#号详解
2017/03/30 Javascript
JavaScript函数柯里化原理与用法分析
2017/03/31 Javascript
Vim快速合并行及vim 将文件所有行合并到一行
2017/11/27 Javascript
微信小程序之swiper滑动面板用法示例
2018/12/04 Javascript
VUE+node(express)实现前后端分离
2019/10/13 Javascript
JS实现星星海特效
2019/12/24 Javascript
[53:10]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs VG 第一场
2018/04/11 DOTA
Python的subprocess模块总结
2014/11/07 Python
python插入数据到列表的方法
2015/04/30 Python
剖析Django中模版标签的解析与参数传递
2015/07/21 Python
在Keras中实现保存和加载权重及模型结构
2020/06/15 Python
python可视化分析的实现(matplotlib、seaborn、ggplot2)
2021/02/03 Python
python中封包建立过程实例
2021/02/18 Python
韩国家庭购物网上商店:Nsmall
2017/05/07 全球购物
Python里面如何拷贝一个对象
2014/02/17 面试题
大二法学专业职业生涯规划范文
2014/02/12 职场文书
人事科岗位职责范本
2014/03/02 职场文书
小区物业门卫岗位职责
2014/04/10 职场文书
父母寄语大全
2014/04/12 职场文书
缅怀先烈演讲稿
2014/09/03 职场文书
党员学习中共十八大思想报告
2014/09/12 职场文书
个人租房协议书样本
2014/10/01 职场文书
个人总结与自我评价2015
2015/03/11 职场文书
小学班长竞选稿
2015/11/20 职场文书
民事纠纷协议书
2016/03/23 职场文书
SpringBoot项目中控制台日志的保存配置操作
2021/06/18 Java/Android