博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
第十八篇 js高级知识---作用域链
阅读量:6598 次
发布时间:2019-06-24

本文共 1594 字,大约阅读时间需要 5 分钟。

         一直有想法去写写js方面的东西,我个人是最喜欢js这门语言,喜欢的他的自由和强大,虽然作为脚本语言有很多限制的地方,但也不失为一个好的语言,尤其是在H5出现之后。下面开始说说js的方面的东西,由于自己的能力有现,有点地方说的不明白,还请高手指点。这个文章,如果有时间的话应该会写一个系列,包括js的高级方面的知识,最终希望能够说到js的引擎方面的东西。千里之行,始于足下,下面开始说说最简单的一个东西—js的作用域链,时常也比较容易弄错,也算是自己做一个纪录。

首先看一段代码:

function t(){          var b=1;          if(b===1){              var name="test1";          }else{              var name="test2";          }          console.log(name);      }      t();

这段代码,可能很多人认为输出的结果是undefine,但是输出的结果是:

可能有点想不明白,如果是在强类型里面这个肯定是要报错的,但是在js的词法分析和运行中确能运算出来结果,这个是原因是什么呢?原来是js中的作用域是和C++/C中的不一样,js中没有块级作用域,作用域只有函数,只要在一个函数里面,你定义的变量在函数的内部任何地方都可以访问到,包括嵌套的函数。用官方的话说是所谓的函数作用域。所以上面的结果就是一个有值的数据,而不是一个undefine.

再看代码修改:

function t() {    var sp = "test1";    if (true) {        var sp = "test2";        console.log(sp);    }    console.log(sp);}t();

这次输出的结果应该很简单了,只要是在函数内部的块级作用域有js里面都不起作用,所以代码可以拆解成:

 

function t() {    var sp = "test1";    // if (true) {
var sp = "test2"; console.log(sp); // } console.log(sp);}t();

 

所以再次输出都是test2;

 

好了,现在应该是初步了解了js的函数作用域了,这个理解清楚了,作用域链自然也就不攻自破。下面看一个简单的代码:

var _name = "windows";function t() {    var name = "test1";    function t1() {        console.log(_name);//1        console.log(name);//2    }    t1();    console.log(_name);//3    console.log(name);//4}t();

如果上面的问题都清楚的话,这个代码应该很简单,因为js是函数的作用域,所以在函数内数据都有能访问,执行顺序如下:

1、在1中,执行console.log(_name);这个_name在当前的函数内没有,到t函数中去寻找,t函数中也没有就会到windows里面去找,找到_name并输出windows,同理2步骤输出”test1”

234 步骤也是同样的道理,所以结果是

从上面的例子可以看出js作用域特点:1、没有块级的作用域,在一个函数的内部定义都有效 2、如果当前数据在当前的函数里面的没有话,会沿着层级向上找。 

t1->t->window,从而形成作用域链。

 

转载于:https://www.cnblogs.com/OceanHeaven/p/4951594.html

你可能感兴趣的文章
Kmp 算法模板 C
查看>>
上下文ac获取为null,SpringContextUtil配置位置,以及各配置xml的加载顺序有讲究...
查看>>
JAVA第五次作业
查看>>
运营平台的体验逆袭
查看>>
Map、Set、List、Queue、Stack的特点与用法
查看>>
linux下的线程池
查看>>
如何使用android studio及夜神模拟器开发调试
查看>>
[Unix]grep工具的-R选项不起作用?
查看>>
猜数游戏
查看>>
JavaWeb_JavaEE_命名规则
查看>>
input表单(02)
查看>>
PHP学习日记 Windows配置PHP+Nginx+自动化脚本
查看>>
Oracle11g服务及实例
查看>>
SOA体系-三大核心部件
查看>>
windows下软件安装目录
查看>>
python 模块初识
查看>>
字符串匹配算法小结
查看>>
串口调试程序,看界面布局
查看>>
angular下H5上传图片(可预览,可多张上传)
查看>>
php分页
查看>>