关于javascript作用域的常见面试题分享


Posted in Javascript onJune 18, 2017

本文主要给大家分享了关于javascript作用域面试题的相关内容,分享出来供大家参考学习,下面来一起看看吧。

一、作用域:

在了解作用域之前,首先需要明白一些基础概念:

每一个变量、函数都有其作用的范围,超出作用不得使用,这个叫做作用域。

二、全局变量、局部变量:

1.全局变量:

     (1)在全局范围内声明的变量,如var a=1;

     (2)只有赋值没有声明的值,如a=2; (注:如果a=2在函数环境中,也是全局变量)

2.局部变量:

      写入函数中的变量,叫做局部变量。

3.作用:

     (1)程序的安全。

     (2)内存的释放。

三、作用域链:

查找量的过程。先找自己局部环境有没有声明或者是函数,如果有,则查看声明有无赋值或者是函数的内容,如果没有,则向上一级查找。

四、预解析顺序:

每个程序都要做的工作,程序开始先预解析语法,标点符号是否有误,解析内存是否可容纳,解析变量……直到解析无误了,才开始按正常的流程顺序走。试想一下,如果没有预解析顺序,直接按流程顺序走,可能程序执行到最后一个函数,发现了语法错误,才开始报错,那性能要有多差啊!

顺序内容:

      1.文件内引用的<script>块依次解析,从上到下连成一片。

      2.每个script块内部的var(注意:只解析变量名,不解析值,如var a=2;将var a解析在环境的开头,并不解析后面的值,只有当程序执行到var a=2这行时,才会给变量赋值),function解析到本块的开头。

      3.依次解析每个环境,将var,function解析到环境的开头。

五、应用场景(一些常见的作用域相关的面试题):

var a="aa";
function test(){
 alert(a);//undefined,函数执行后,在函数环境内,var a会预解析,当弹出a时,首先先找本层环境内有无声明,发现有。但是代码没有执行到赋值,所以结果是undefined。
 var a="bb";//var a会预解析在函数开头,执行到这行才进行赋值
 alert(a);//“bb”
}
test();
alert(a);//"aa" 找全局环境下的声明,找到了var a="aa"
var a="aa";
function test(){
 alert(a);//“aa”,函数执行后,在函数环境内,没有找到本层环境关于a的声明,所以开始向上一层环境查找。
 a="bb";//执行到这行开始改变全局a的量
}
test();
alert(a);//"bb" 全局环境的a在函数执行时已经被改变
function test(){ 
 b();//函数b会被预解析,因此可以调用,执行了输出1;
 var a=1;
 function b(){
  console.log(1);
  console.log(a);//undefined
  var a=2;
 }
}
test();

六、总结:

要搞清楚一个变量的作用域,重点是搞清楚预解析顺序,然后再判断作用域的范围,这些都是有套路可言:先找本层环境有无声明,有的话,看是否进行了赋值;只有声明没有执行赋值,就是undefined。没有声明也没有赋值的话,就再向上一层查找,直到找到为止。如果所有的执行环境都没有找到,那么控制台就会报错变量找不到。

函数的话就更简单了:找本层环境是否有预解析的函数,有的话即可执行。没有的话还是向上查找。

好了,以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
jQuery 动态酷效果实现总结
Dec 27 Javascript
jquery中ajax学习笔记3
Oct 16 Javascript
thinkphp中常用的系统常量和系统变量
Mar 05 Javascript
IE 下Enter提交表单存在重复提交问题的解决方法
May 04 Javascript
jQuery网页版打砖块小游戏源码分享
Aug 20 Javascript
AngularJS实现单独作用域内的数据操作
Sep 05 Javascript
微信小程序 POST请求的实例详解
Sep 29 Javascript
解决vue-cli创建项目的loader问题
Mar 13 Javascript
Node.js 使用jade模板引擎的示例
May 11 Javascript
jQuery判断自定义属性data-val用法示例
Jan 07 jQuery
微信小程序实现的canvas合成图片功能示例
May 03 Javascript
layui+SSM的数据表的增删改实例(利用弹框添加、修改)
Sep 27 Javascript
Angular.js中下拉框实现渲染html的方法
Jun 18 #Javascript
Webpack打包css后z-index被重新计算的解决方法
Jun 18 #Javascript
利用JavaScript对中文(汉字)进行排序实例详解
Jun 18 #Javascript
JavaScript ES6中const、let与var的对比详解
Jun 18 #Javascript
jquery DataTable实现前后台动态分页
Jun 17 #jQuery
jQuery Jsonp跨域模拟搜索引擎
Jun 17 #jQuery
vue router路由嵌套不显示问题的解决方法
Jun 17 #Javascript
You might like
dedecms 批量提取第一张图片最为缩略图的代码(文章+软件)
2009/10/29 PHP
PHP使用Nginx实现反向代理
2017/09/20 PHP
用Laravel Sms实现laravel短信验证码的发送的实现
2018/11/29 PHP
PHP设计模式之模板模式定义与用法详解
2018/12/20 PHP
利用js对象弹出一个层
2008/03/26 Javascript
JavaScript中的面向对象介绍
2012/06/30 Javascript
js过滤HTML标签以及空格的思路及代码
2013/05/24 Javascript
javascript中mouseover、mouseout使用详解
2015/07/19 Javascript
javascript跨域方法、原理以及出现问题解决方法(详解)
2015/08/06 Javascript
js采用concat和sort将N个数组拼接起来的方法
2016/01/21 Javascript
js中数组结合字符串实现查找(屏蔽广告判断url等)
2016/03/30 Javascript
无缝滚动的简单实现代码(推荐)
2016/06/07 Javascript
require.js配合插件text.js实现最简单的单页应用程序
2016/07/12 Javascript
jQuery Easyui datagrid连续发送两次请求问题
2016/12/13 Javascript
js取小数点后两位四种方法
2019/01/18 Javascript
element-ui组件中input等的change事件中传递自定义参数
2019/05/22 Javascript
从零使用TypeScript开发项目打包发布到npm
2020/02/14 Javascript
[01:03:41]DOTA2-DPC中国联赛 正赛 Dynasty vs XG BO3 第三场 2月2日
2021/03/11 DOTA
Python cv2 图像自适应灰度直方图均衡化处理方法
2018/12/07 Python
Numpy中对向量、矩阵的使用详解
2019/10/29 Python
Python创建数字列表的示例
2019/11/28 Python
Python使用type动态创建类操作示例
2020/02/29 Python
Python中Selenium模块的使用详解
2020/10/09 Python
Python第三方库安装缓慢的解决方法
2021/02/06 Python
意大利独特而优质的家居用品:Fazzini
2018/12/05 全球购物
电气工程及其自动化自我评价四篇
2013/09/24 职场文书
孝老爱亲模范事迹
2014/01/24 职场文书
金融管理毕业生求职信
2014/03/03 职场文书
培训讲师岗位职责
2014/04/13 职场文书
小学国旗下的演讲稿
2014/08/28 职场文书
大学学生会竞选稿
2015/11/19 职场文书
2016年教师政治思想表现评语
2015/12/02 职场文书
党员电教片《信仰》心得体会
2016/01/15 职场文书
2016年6.5世界环境日宣传活动总结
2016/04/01 职场文书
五年级作文之成长
2019/09/16 职场文书
Canvas绘制像素风图片的示例代码
2021/09/25 HTML / CSS