关于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 相关文章推荐
Maps Javascript
Jan 22 Javascript
基于jQuery判断两个元素是否有重叠部分的代码
Jul 25 Javascript
jQuery显示和隐藏 常用的状态判断方法
Jan 29 Javascript
基于jquery步骤进度条源码分享
Nov 12 Javascript
AngularJS基础 ng-list 指令详解及示例代码
Aug 02 Javascript
js 获取元素所有兄弟节点的实现方法
Sep 06 Javascript
Node.js利用Net模块实现多人命令行聊天室的方法
Dec 23 Javascript
JavaScript设计模式之单例模式简单实例教程
Jul 02 Javascript
使用vue2实现带地区编号和名称的省市县三级联动效果
Nov 05 Javascript
详解Vue+Element的动态表单,动态表格(后端发送配置,前端动态生成)
Apr 20 Javascript
原生小程序封装跑马灯效果
Oct 21 Javascript
JavaScript高级程序设计之变量与作用域
Nov 17 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
PHP脚本数据库功能详解(上)
2006/10/09 PHP
深入分析使用mysql_fetch_object()以对象的形式返回查询结果
2013/06/05 PHP
关于js和php对url编码的处理方法
2014/03/04 PHP
phpmyadmin在宝塔面板里进不去的解决方案
2020/07/06 PHP
新浪中用来显示flash的函数
2007/04/02 Javascript
前淘宝前端开发工程师阿当的PPT中有JS技术理念问题
2010/01/15 Javascript
基于jquery的可多选的下拉列表框
2012/07/20 Javascript
JavaScript建立一个语法高亮输入框实现思路
2013/02/26 Javascript
可自定义速度的js图片无缝滚动示例分享
2014/01/20 Javascript
jQuery事件之键盘事件(ctrl+Enter回车键提交表单等)
2014/05/11 Javascript
jQuery中replaceWith()方法用法实例
2014/12/25 Javascript
jQuery实现带动画效果的二级下拉导航方法
2015/03/11 Javascript
JavaScript 封装一个tab效果源码分享
2015/09/15 Javascript
js实现3D图片环展示效果
2017/03/09 Javascript
jQuery实现一个简单的验证码功能
2017/06/26 jQuery
基于vue-cli vue-router搭建底部导航栏移动前端项目
2018/02/28 Javascript
webpack的tree shaking的实现方法
2019/09/18 Javascript
react quill中图片上传由默认转成base64改成上传到服务器的方法
2019/10/30 Javascript
JavaScript实现原型封装轮播图
2020/12/27 Javascript
js删除对象中的某一个字段的方法实现
2021/01/11 Javascript
详解Django缓存处理中Vary头部的使用
2015/07/24 Python
Python使用迭代器打印螺旋矩阵的思路及代码示例
2016/07/02 Python
在django中自定义字段Field详解
2019/12/03 Python
解决Keras 与 Tensorflow 版本之间的兼容性问题
2020/02/07 Python
python实现扑克牌交互式界面发牌程序
2020/04/22 Python
Python 的 f-string 可以连接字符串与数字的原因解析
2021/02/20 Python
Html5 实现微信分享及自定义内容的流程
2019/08/20 HTML / CSS
设计总监岗位职责
2013/12/07 职场文书
演讲稿怎么写
2014/01/07 职场文书
班风学风建设方案
2014/05/06 职场文书
离婚协议书范本(2014版)
2014/09/28 职场文书
暑假社会实践证明格式
2014/10/28 职场文书
2014年派出所工作总结
2014/11/21 职场文书
《初涉尘世》读后感3篇
2020/01/10 职场文书
使用feign服务调用添加Header参数
2021/06/23 Java/Android
Windows Server 2019 安装DHCP服务及相关配置
2022/04/28 Servers