一道关于JavaScript变量作用域的面试题


Posted in Javascript onMarch 08, 2016

小编觉得这道题对理解JavaScript 作用域还是很有帮助的,特此又把自己的解题思路梳理了一遍,希望对其它人有所帮助。

首先看下面试题:

var arr = [1, 2, 3];
  for (var i = 0, j; j = arr[i++];) {
    console.log(j);
  }

  console.log('---------');
  console.log(i);
  console.log('---------');
  console.log(j);
  console.log('---------');

在解题前,我们先回顾下 JavaScript 中,变量域相关的知识。

全局变量(Global)
全局变量是指在任何地方都可以访问的变量,有两种情况

在 function 外面声明,不论是否用 var 关键字
在 function 里面声明,不使用 var 关键字,当然声明的语句必须被执行才可以
局部变量(Local )
局部变量只能在被声明的 function 内部才能访问
在 function 里面声明,使用 var 关键字
两点要注意的地方

先看代码:

alert(i); // 输出 undefined
 
 for (var i = 0; i < 1; i++){};
 
 alert(i); // 输出1

JavaScript 不存在语句作用域,在语句内定义的变量会扩散到语句外边, 例子中 i 在 for 语句中声明,但是在 for 语句的外面任然可以访问
在 for 语句之前就可以访问到 i ,只不过这时候还没有被赋值
开始我们的解题

i++ 是在 i 使用后再自加:

第一次执行时,j=arr[0],之后 i=1,console.log(j) 输出 1

第二次执行时,j=arr[1],之后 i=2,ocnsole.log(j) 输出 2

第三次执行时,j=arr[2],之后 i=3,ocnsole.log(j) 输出 3

第四次(不符合 for  条件),j=arr[3] 为 undefined,之后 i=4,ocnsole.log(j) 没有输出,退出 for 循环

for 语句执行结束后,console.log(i) 由上分析可知输出 4,console.log(j) 输出 undefined

最后输出结果为:

2
---------
---------
undefined
---------

针对上面的分析和结果,想必大家都已经搞清楚了吧,然后我们开始举一反三吧。

借题改题一
题目:
var arr = [1, 2, 3];

for (var i = 0, j; j = arr[++i];) {
    console.log(j);
  }

  console.log('---------');
  console.log(i);
  console.log('---------');
  console.log(j);
  console.log('---------');

答案:

2
3
---------
3
---------
undefined
---------

借题改题二
题目:

function xxx() {
    var arr = [1, 2, 3];
    for (var i = 0, j; j = arr[i++];) {
      console.log(j);
    }
  }
  xxx();

  console.log('---------');
  console.log(i);
  console.log('---------');
  console.log(j);
  console.log('---------');

答案:

1
2
3
---------
报错:Uncaught ReferenceError: i is not defined

为大家就分享到这,希望对大家理解JavaScript作用域有所帮助。

Javascript 相关文章推荐
js字符编码函数区别分析
Jun 05 Javascript
javascript iframe中打开文件,并检测iframe存在否
Dec 28 Javascript
JavaScript CSS修改学习第六章 拖拽
Feb 19 Javascript
jquery miniui 教程 表格控件 合并单元格应用
Nov 25 Javascript
js post提交调用方法
Feb 12 Javascript
js如何实现点击标签文字,文字在文本框出现
Aug 05 Javascript
浅谈js中startsWith 函数不能在任何浏览器兼容的问题
Mar 01 Javascript
jQuery Datatables表头不对齐的解决办法
Nov 27 jQuery
JavaScript去掉数组重复项的方法分析【测试可用】
Jul 19 Javascript
微信小程序使用gitee进行版本管理
Sep 20 Javascript
小程序实现多列选择器
Feb 15 Javascript
jQuery实现简单弹幕制作
Dec 10 jQuery
理解javascript函数式编程中的闭包(closure)
Mar 08 #Javascript
jQuery实现带水平滑杆的焦点图动画插件
Mar 08 #Javascript
javascript对象的创建和访问
Mar 08 #Javascript
js获取当前日期时间及其它日期操作汇总
Mar 08 #Javascript
使用JQuery实现智能表单验证功能
Mar 08 #Javascript
js表单处理中单选、多选、选择框值的获取及表单的序列化
Mar 08 #Javascript
JS实现设置ff与ie元素绝对位置的方法
Mar 08 #Javascript
You might like
多文件上传的例子
2006/10/09 PHP
Windows下利用Gvim写PHP产生中文乱码问题解决方法
2011/04/20 PHP
php截取字符串之截取utf8或gbk编码的中英文字符串示例
2014/03/12 PHP
CodeIgniter安全相关设置汇总
2014/07/03 PHP
ecshop实现smtp发送邮件
2015/02/03 PHP
php自定义urlencode,urldecode函数实例
2015/03/24 PHP
PHP开发api接口安全验证操作实例详解
2020/03/26 PHP
Dom在ajax技术中的作用说明
2010/10/25 Javascript
动态载入js提高网页打开速度的方法
2014/07/04 Javascript
angularJS 入门基础
2015/02/09 Javascript
jQuery源码解读之removeClass()方法分析
2015/02/20 Javascript
微信小程序之仿微信漂流瓶实例
2016/12/09 Javascript
js实现模糊匹配功能
2017/02/15 Javascript
JS设置随机出现2个数字的实例代码
2017/07/19 Javascript
vue自定义过滤器创建和使用方法详解
2017/11/06 Javascript
React通过redux-persist持久化数据存储的方法示例
2019/02/14 Javascript
解决JQuery的ajax函数执行失败alert函数弹框一闪而过问题
2019/04/10 jQuery
Python中dictionary items()系列函数的用法实例
2014/08/21 Python
Python求导数的方法
2015/05/09 Python
轻松掌握python设计模式之策略模式
2016/11/18 Python
Python中矩阵库Numpy基本操作详解
2017/11/21 Python
ubuntu中配置pyqt4环境教程
2017/12/27 Python
python学习基础之循环import及import过程
2018/04/22 Python
Python3实现转换Image图片格式
2018/06/21 Python
pyqt5 实现 下拉菜单 + 打开文件的示例代码
2019/06/20 Python
python向图片里添加文字
2019/11/26 Python
Python如何实现FTP功能
2020/05/28 Python
PyCharm 2020.1版安装破解注册码永久激活(激活到2089年)
2020/09/24 Python
Python tkinter之ComboBox(下拉框)的使用简介
2021/02/05 Python
英国奢侈品概念店:Base Blu
2019/05/16 全球购物
W Hamond官网:始于1979年的钻石专家
2020/07/20 全球购物
工作总结与自我评价
2014/09/18 职场文书
职代会闭幕词
2015/01/28 职场文书
忠诚与背叛观后感
2015/06/04 职场文书
2015大一新生军训感言
2015/08/01 职场文书
golang elasticsearch Client的使用详解
2021/05/05 Golang