目录

1.什么是全局变量和局部变量

2.全局变量和局部变量的声明

2.1 全局变量的声明

2.2 局部变量的声明

3.全局变量和局部变量一些常见问题

3.1全局变量跟局部变量重名

3.2 零散变量的问题

3.3. 变量释放问题

总结:


1.什么是全局变量和局部变量

全局变量:常常定义在函数外部,拥有全局作用域,即在 JavaScript 代码的任何地方都可以访问。

局部变量:定义在函数内部,只能在函数中使用的变量,作用范围是从函数开始到结尾,即在{}里。

在函数内声明的变量只在函数体内有定义,即为局部变量,其作用域是局部性的。需要注意的是,在函数体内声明局部变量时,如果不使用 var 关键字,则将声明全局变量。

<script>var str1 = "hello1"; //定义一个全局变量function a() {var str2 = "hello2"; //定义一个局部变量str3 = "hello3"; //定义一个全局变量}
</script>

此处str1和str3是全局变量,str2为局部变量。

2.全局变量和局部变量的声明

2.1 全局变量的声明

在js中全局变量声明方式分为显式声明和隐式声明。

第一种声明方式:使用var关键字+变量名在函数外部声明就是全局变量,例如:

var bianliang = "全局变量";

第二种声明方式:没有使用var关键字声明,直接给变量名赋值,不管是在函数内部还是外部都是全局变量,例如:

<script>text = "全局变量";function bl() {text1 = "我也是全局变量";var text2 = "我是局部变量";console.log(text2); //局部变量只能在函数中使用}bl() //结果:我是局部变量console.log(text); //结果:全局变量console.log(text1); //结果:我也是全局变量//console.log(text2); //局部变量,在函数外使用会报错
</script>

第三种声明方式: 使用window全局对象来声明,全局对象的属性对应也是全局变量,例如:

window.test3 = 'window全局对象声明全局变量';console.log(test3);//结果:window全局对象声明全局变量

2.2 局部变量的声明

声明局部变量一定要使用var关键字,使用var关键字声明变量时,变量会自动添加到距离最近的可用环境中。如果没有写var, 变量就会暴露在全局上下文中, 成为全局变量。如果变量在未声明的情况下被初始化,该变量会自动添加到全局环境。

<script>function bl() {text1 = "我也是全局变量";//没有使用var 为全局变量var text2 = "我是局部变量";console.log(text2); //局部变量只能在函数中使用}
</script>

3.全局变量和局部变量一些常见问题

3.1全局变量跟局部变量重名

当全局变量跟局部变量重名时,局部变量的scope会覆盖掉全局变量的scope,当离开局部变量的scope后,又重回到全局变量的scope。

<script>var str = "我是全局变量";function b() {var str = "我是局部变量";console.log(str); //结果:我是局部变量}b();console.log(str);//结果:我是全局变量
</script>

当全局变量遇上局部变量时,怎样使用全局变量呢?用window.globalVariableName。

<script>var a = 1; //全局变量! function b() {var a = 2; //局部变量a在这行定义console.log(window.a); //a为1,这里的a是全局变量哦!console.log(a); //a为2,这里的a是局部变量哦!}()console.log(a); //a为1,这里并不在function b scope内,a的值为全局变量的值
</script>

3.2 零散变量的问题

Javascript在执行前会对整个脚本文件的声明部分做完整分析(包括局部变量),从而确定变量的作用域。所以Javascript允许在函数的任意地方声明变量,无论在哪里声明,效果都等同于在函数顶部进行声明。怎么理解呢?看下面一个例子:

<script>var str = "我是全局变量";! function b() {console.log(str); //结果:undefinedvar str = "我是局部变量";console.log(str); //结果:我是局部变量}()
</script>

为什么不是: 我是全局变量 和 我是局部变量?
原因很简单:对JavaScript而言,只要变量是在同一个范围(函数)里,就视为已经声明,哪怕是在变量声明前就使用。上面的代码相当于:

<script>var str = "我是全局变量";! function b() {var str; //系统自动赋值为 str = undefinedconsole.log(str); //结果:undefinedvar str = "我是局部变量";console.log(str); //结果:我是局部变量}()
</script>

3.3. 变量释放问题

请看下面的代码:

<script>var a = "hello"; //全局变量window.b = "word"; //全局变量delete a;delete b;console.log(typeof a); //结果:stringconsole.log(typeof b); //结果:undefined! function b() {var c = 1; //局部变量d = 2; //全局变量delete c;delete d;console.log(typeof c); //结果:numberconsole.log(typeof d); //结果:undefined}()
</script>

结论:

  • 使用 var 创建的变量不能使用 delete 释放内存。
  • 不使用 var 创建的变量可以使用 delete 释放内存。

总结:

1.在过程体内(包括方法function(){},对象Object o={})内的对象)加var保留字则为局部变量,其他情况下都是全局变量(无论是否使用var。不进行声明而直接使用全局变量会报错(可以隐式声明),而局部变量先使用后声明则不会报错,只是值为undefined。

2.全局变量跟局部变量重名时,局部变量的范围会覆盖掉全局变量的范围,当离开局部变量的范围后,又重回到全局变量的范围。(若想指定是全局变量可以使用 window.globalVariableName。

3.Javascript允许在函数的任意地方声明变量,无论在哪里声明,效果都等同于在函数顶部进行声明。

4.使用 var 创建的变量不能使用 delete 释放内存,其他方式创建的变量可以使用 delete 释放内存。

一般来说全局变量所带来的 bug 问题非常多,所以最好尽量少用全局变量。另外,声明变量最好带 var, 不应使用带 var 的链式赋值,在函数体内定义变量时,最好把变量声明放在顶部,防止出现变量没有被定义就被使用的逻辑错误。

搞懂JavaScript全局变量与局部变量,看这篇文章就够了相关推荐

  1. 搞懂Xamarin.Forms布局,看这篇应该就够了吧

    Xamarin.Forms 布局介绍 什么是布局?可以简单的理解为,我们通过将布局元素有效的组织起来,让屏幕变成我们想要的样子! 我们通过画图的方式来描述一下Xamarin.Forms的布局. 小节锚 ...

  2. 搞懂Java分布式锁实现看这篇文章就对了

    2019独角兽企业重金招聘Python工程师标准>>> 前言: 随着微处理机技术的发展,人们只需花几百美元就能买到一个CPU芯片,这个芯片每秒钟执行的指令比80年代最大的大型机的处理 ...

  3. 使用分层网络模型的两个优点是什么_从零开始学网络|搞懂OSI参考模型和TCP/IP分层模型,看这篇文章就够了...

    从零开始学网络|搞懂OSI参考模型和TCP/IP分层模型,看这篇文章就够了​mp.weixin.qq.com 前言 今天和大家一起谈谈"网络",之前写的文章可能不太通俗易懂,有人就 ...

  4. 万字心得,PMP学习考试那些事儿,看这篇文章就够了

    声明:文章为原创,首发于知乎,链接:万字长文!PMP考试那些事儿,看这篇文章就够了 - 知乎 (zhihu.com)https://zhuanlan.zhihu.com/p/524966002 以下内 ...

  5. Vue开发入门看这篇文章就够了

    摘要: 很多值得了解的细节. 原文:Vue开发看这篇文章就够了 作者:Random Fundebug经授权转载,版权归原作者所有. 介绍 Vue 中文网 Vue github Vue.js 是一套构建 ...

  6. 好多人都说存储过程很难?认真看这篇文章就够了

    何为存储过程? 存储过程是在数据库管理系统中保存的.预先编译的并能实现某种功能的sql程序,说直白点,java知道吧?和java的方法一样. 每遇到一个新的知识点时,我们都会看看它的优点,从而加深对它 ...

  7. Python-Excel 零基础学习xlwings,看这篇文章就够了

    零基础学习xlwings,看这篇文章就够了 | 一起大数据-技术文章心得 (17bigdata.com) 1.xlwings是什么 2.xlwings安装更新与卸载 3.xlwings详细使用 4.案 ...

  8. Android 8.0新特性(看这篇文章就够了)

    2019独角兽企业重金招聘Python工程师标准>>> 在刚结束不久的谷歌 I/O2017开发者大会上发布的第二个Android O(安卓8.0)开发者预览,并且向普通用户开放了第二 ...

  9. python入门书籍推荐,看这篇文章就够,请!

    python入门书籍推荐,看这篇文章就够,请! 事实上,有关python的书籍很多很多,就当当网就有50000件和python有关的书籍,我特地去了当地的新华书店,蹲了大半天,回来给大家推荐,适合想学 ...

最新文章

  1. vue 在浏览器控制台怎么调试 谷歌插件vue Devtools
  2. bzoj 1731 [Usaco2005 dec]Layout 排队布局——差分约束
  3. java gsoap_gsoap c与java web之间传输字符串中文乱码问题 | 学步园
  4. 横琴今年建物联网基础设施
  5. 来点硬件知识吧,今天求职吃亏了!
  6. 2021年下半年 全国计算机技术与软件专业技术资格考试 浙江省合格人员数据分布
  7. html菜鸟ruby,ruby的基础语法
  8. CentOS 6.0 下 VNC 配置方法
  9. STM8L低功耗模式
  10. krohne流量计接线图_电磁流量计接线方式
  11. Elasticsearch 7.13 删除文档后如何释放存储空间、手动执行forcemerge操作
  12. 图像深度:8bit、16bit、24bit、32bit; 16.7M色彩
  13. 前端战五渣学前端——模板引擎(Handlebars.js)
  14. css 设置背景图片模糊效果
  15. 【世界数学难题】21世纪世界七大数学难题简介
  16. Firefox 本地保存密码破解 (破解key3.db, signons.sqlite , key4.db, logins.json)
  17. 如何实现BLE 最大数据吞吐率并满足设计功耗要求?
  18. 任意密码重置;越权查看他人信息及修改信息
  19. 广东出台文件标准租借屋电费结算 下一年起履行
  20. 安卓入门项目-模仿某商城day02-仿拼多多搜索页面多列表联动

热门文章

  1. linux添加用户和用户组
  2. C/C++用宏定义函数
  3. 低代码对接腾讯云-阿里云短信平台
  4. HDU 6072 Logical Chain (Biset+Kosaraju, 2017 Multi-Univ Training Contest 4)
  5. 年轻人不讲武德,一起聊聊List集合(五)
  6. Android 怎么退出整个应用程序?
  7. Python爬取网易云音乐所有歌手的名称和链接
  8. 智能手表全国产化电子元件推荐方案
  9. 王者荣耀23号服务器维护,王者荣耀3月23日登入异常却因这件小事 天美损失惨重...
  10. 2016年节点——增长的一年:不只编程