JS变量及其作用域


Posted in Javascript onMarch 29, 2017

1、 变量及其作用域:变量分为“全局变量”和“局部变量”,“全局变量”申明在函数外部,可供所有函数使用,而“局部变量”申明在函数体内部,只能在定义该变量的函数体内使用。

(备注:在申明变量时没有var关键字,而是直接赋值的变量均为全局变量)

<script type="text/javascript">
  function main() {
    n = 10;//这里的n为全局变量,可以被外部直接使用
  }
  main();
  alert(n);
</script>

2、 在函数体内,局部变量的优先级高于全局变量。

<script type="text/javascript">
  //网上看到的我认为很有代表性的一个例子,在函数体外部和内部都申明了相同名字的变量,变量的作用域问题,例子如下:
  var n = 1;
  function test() {
    alert(n); //这里的a并不是全局变量,原因是函数体第四行申明了一个相同重名的局部变
         //量a,如果把第四行a的申明注释掉,那么这里的a显示1,为全局变量。所以得
         //出结论:全局变量a被局部变量a覆盖了。
         //说明了JS函数在test()在执行前,函数体内的变量a都指向了局部变量,但本
         //行输出的a在执行过程中还没有被赋值,所以显示undefined。
    n = 2;
    alert(n);
    var n; //本行申明局部变量a
    alert(n);
  }
    test();
    alert(n);
</script>

按照我的理解,上面例子最后输出的答案应该是:1 2 2 1;但是正确的答案是:undefined 2 2 1; 原因就是函数体外部和内部都申明了相同名字的变量时,局部变量覆盖了全局变量。

3、 外部怎么读取函数体内部的局部变量呢?

一般来说,只有函数体内部可以直接得到外部的全局变量,但是外部要得到函数体内部的局部变量是不行的。但是,通过在函数体内部再定义一个函数返回局部变量,再从外部调用函数就能实现了。

<script type="text/javascript">
  function f1() {

    var n = 10;


    function f2() {//在f1()内部再定义f2(),通过f2()访问f1()中的局部变量



      alert(n);


    }


    return f2;//返回f1()局部变量n
  }

  var result = f1(); //在外部调用f1()函数,就能获取局部变量n的值
  result(); // 10,即为n的值
</script>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
自动检查并替换文本框内的字符
Jun 30 Javascript
javascript截取字符串小结
Apr 28 Javascript
javascript 数组的定义和数组的长度
Jun 07 Javascript
AngularJS+Bootstrap实现多文件上传与管理
Nov 08 Javascript
JS实现拖拽的方法分析
Dec 20 Javascript
微信小程序 WebSocket详解及应用
Jan 21 Javascript
JS区分Object与Aarry的六种方法总结
Feb 27 Javascript
微信小程序实现获取自己所处位置的经纬度坐标功能示例
Nov 30 Javascript
优雅的elementUI table单元格可编辑实现方法详解
Dec 23 Javascript
浅谈Vue.js组件(二)
Apr 09 Javascript
微信小程序日历弹窗选择器代码实例
May 09 Javascript
js实现简单五子棋游戏
May 28 Javascript
如何使用Bootstrap 按钮实例详解
Mar 29 #Javascript
Vue 2.0 服务端渲染入门介绍
Mar 29 #Javascript
vue2组件实现懒加载浅析
Mar 29 #Javascript
整理关于Bootstrap排版的慕课笔记
Mar 29 #Javascript
如何使用Bootstrap创建表单
Mar 29 #Javascript
Bootstrap 响应式实用工具实例详解
Mar 29 #Javascript
jQuery日程管理控件glDatePicker用法详解
Mar 29 #jQuery
You might like
首页四格,首页五格For6.0(GBK)(UTF-8)[12种组合][9-18][版主安装测试通过]
2007/09/24 PHP
关于页面优化和伪静态
2009/10/11 PHP
关于PHP实现异步操作的研究
2013/02/03 PHP
PHP实现即时输出、实时输出内容方法
2015/05/27 PHP
PHP登录(ajax提交数据和后台校验)实例分享
2016/12/29 PHP
jQuery 选择器、DOM操作、事件、动画
2010/11/25 Javascript
File, FileReader 和 Ajax 文件上传实例分析(php)
2011/04/27 Javascript
Javascript 闭包引起的IE内存泄露分析
2012/05/23 Javascript
js利用数组length属性清空和截短数组的小例子
2014/01/15 Javascript
js实现宇宙星空背景效果的方法
2015/03/03 Javascript
[原创]jQuery常用的4种加载方式分析
2016/07/25 Javascript
js微信分享API
2020/10/11 Javascript
几句话带你理解JS中的this、闭包、原型链
2016/09/26 Javascript
mvc 、bootstrap 结合分布式图简单实现分页
2016/10/10 Javascript
一句jQuery代码实现返回顶部效果(简单实用)
2016/12/28 Javascript
javascript 判断当前浏览器版本并判断ie版本
2017/02/17 Javascript
jQuery菜单实例(全选,反选,取消)
2017/08/28 jQuery
详解vue-cli脚手架build目录中的dev-server.js配置文件
2017/11/24 Javascript
vue实现的双向数据绑定操作示例
2018/12/04 Javascript
微信小程序 SOTER 生物认证DEMO 指纹识别功能
2019/12/13 Javascript
[02:08]2018年度CS GO枪械皮肤设计大赛优秀作者-完美盛典
2018/12/16 DOTA
Python实现大文件排序的方法
2015/07/10 Python
Python中subprocess的简单使用示例
2015/07/28 Python
django 装饰器 检测登录状态操作
2020/07/02 Python
详细分析Python可变对象和不可变对象
2020/07/09 Python
基于python实现监听Rabbitmq系统日志代码示例
2020/11/28 Python
10个python爬虫入门基础代码实例 + 1个简单的python爬虫完整实例
2020/12/16 Python
怎样自定义一个异常类
2016/09/27 面试题
合作经营协议书
2014/04/17 职场文书
安全月活动总结
2014/05/05 职场文书
我的中国梦演讲稿小学篇
2014/08/19 职场文书
交通事故协议书范文
2014/10/23 职场文书
实习指导教师评语
2014/12/30 职场文书
oracle DGMGRL ORA-16603报错的解决方法(DG Broker)
2021/04/06 Oracle
PHP实现rar解压读取扩展包小结
2021/06/03 PHP
Spring Boot 使用 Spring-Retry 进行重试框架
2022/04/24 Java/Android