一道关于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 相关文章推荐
JavaScript中__proto__与prototype的关系深入理解
Dec 04 Javascript
alert中断settimeout计时功能
Jul 26 Javascript
JS+JSP checkBox 全选具体实现
Jan 02 Javascript
浏览器窗口加载和大小改变事件示例
Feb 27 Javascript
js简单时间比较的方法
Aug 02 Javascript
ES6中的rest参数与扩展运算符详解
Jul 18 Javascript
JS随机排序数组实现方法分析
Oct 11 Javascript
微信小程序实现tab左右切换效果
Nov 15 Javascript
简单说说如何使用vue-router插件的方法
Apr 08 Javascript
element-ui中Table表格省市区合并单元格的方法实现
Aug 07 Javascript
vue中touch和click共存的解决方式
Jul 28 Javascript
Vue(定时器)解决mounted不能获取到data中的数据问题
Jul 30 Javascript
理解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
php设计模式之观察者模式的应用详解
2013/05/21 PHP
php像数组一样存取和修改字符串字符
2014/03/21 PHP
php实现的任意进制互转类分享
2015/07/07 PHP
PHP中CheckBox多选框上传失败的代码写法
2017/02/13 PHP
PHP+百度AI OCR文字识别实现了图片的文字识别功能
2019/05/08 PHP
extjs fckeditor集成代码
2009/05/10 Javascript
Visual Studio中的jQuery智能提示设置方法
2010/03/27 Javascript
EasyUI中的tree用法介绍
2011/11/01 Javascript
jquery实现预览提交的表单代码分享
2014/05/21 Javascript
NodeJS学习笔记之Connect中间件模块(二)
2015/01/27 NodeJs
JQuery select(下拉框)操作方法汇总
2015/04/15 Javascript
JavaScript实现自动对页面上敏感词进行屏蔽的方法
2015/07/27 Javascript
iframe中子父类窗口调用JS的方法及注意事项
2015/08/25 Javascript
JavaScript的Backbone.js框架环境搭建及Hellow world示例
2016/05/07 Javascript
node.js 动态执行脚本
2016/06/02 Javascript
javascript宿主对象之window.navigator详解
2016/09/07 Javascript
JS中静态页面实现微信分享功能
2017/02/06 Javascript
Javascript中八种遍历方法的执行速度深度对比
2017/04/25 Javascript
浅谈Vue网络请求之interceptors实际应用
2018/02/28 Javascript
微信小程序request请求封装,验签代码实例
2019/12/04 Javascript
js将URL网址转为16进制加密与解密函数
2020/03/04 Javascript
js动态生成表格(节点操作)
2021/01/12 Javascript
python中关于日期时间处理的问答集锦
2013/03/08 Python
Python 类与元类的深度挖掘 I【经验】
2016/05/06 Python
浅谈python中真正关闭socket的方法
2018/12/18 Python
pandas计数 value_counts()的使用
2019/06/24 Python
Python实现名片管理系统
2020/02/14 Python
python文件编写好后如何实践
2020/07/07 Python
详解python日志输出使用配置文件格式
2021/02/10 Python
茱莉蔻美国官网:Jurlique美国
2020/11/24 全球购物
毕业生自我鉴定实例
2014/01/21 职场文书
实习协议书范本
2014/04/22 职场文书
领导批评与自我批评范文
2014/10/16 职场文书
八年级作文之感恩
2019/11/22 职场文书
教你利用Nginx 服务搭建子域环境提升二维地图加载性能的步骤
2021/09/25 Servers
阿里云日志过滤器配置日志服务
2022/04/09 Servers