【初始】JavaScript基础之作用域和作用域链

举报
hw02441001 发表于 2020/08/07 11:04:35 2020/08/07
【摘要】 课程里面的作用域链是一笔带过,根据我对“链”这个词的敏感,我又上网查阅了一些资料。简单总结一点东西,能力有限,欢迎来补充。

作用域是JavaScript最重要的概念之一,打好JavaScript的基础就要理解作用域和作用域链的原理。


作用域,简单来说其实就是变量、函数、对象的访问规则的有效范围。

可能文字不太好理解,先看一个经典的例子帮助我们建立作用域这个概念:

function fun() {

var str= "我是内层变量";

}

fun2();//要先执行这个函数,否则根本不知道里面是啥

console.log(str); // inVariable is not defined


变量str在函数fun里面声明,那么我们在函数外面调用就会报错,因为变量str没有在全局作用域声明。

那么以下代码是成立的


function fun() {

var str= "我是内层变量";

console.log(str)//"我是内层变量"

}

var str=“我是全局变量”

console.log(str)//"我是全局变量"

由此可以看出,作用域最大的作用就是隔离变量,不同作用域下相同的变量名不存在冲突。


全局作用域和局部作用域

全局作用域:在任何地方都能访问到的变量、函数、对象 拥有全局作用域。

1.在js文件中直接定义的变量,最外层的函数。

var str="我是最外层变量";

function fun(){

console.log("我是最外层函数");

}

2.未定义直接赋值的变量会拥有全局作用域。

function fun(){

    str="我是未声明直接赋值的变量";

  var str1="我是在函数内部声明的变量";

fun();

console.log(str);

console.log(str1);

}

 fun();//"我是未声明直接赋值的变量"; "我是在函数内部声明的变量";

console.log(str);//"我是未声明直接赋值的变量";

console.log(str1);//str1 is not defined

【注】这点刚开始有点没法接受,但是熟悉之后就能辨别出来,可能这是JS的特别之处。

3.window是天然存在的全局对象,它存储了JS中所有全局数据。

window.alert()      window.parseInt()   等等

分析:看了上述例子,我们不难发现,全局作用域的弊端-不灵活,如果我们写了很多全局作用域的代码,那么它的命名将会是复杂的,容易引起冲突。

局部作用域:与全局作用域相反,局部作用域就是在固定的代码片段生效。函数作用域就是典型的局部作用域。

 function fun(){

  var str="我在函数内";

}

fun();

console.log(str)//str is not defined



作用域还有一个特点,相对来说,内部作用域的可以访问外部作用域的变量,反之不行。

 var  str="我是全局变量"

   function fun(){

   console.log(str);

}

 fun();//"我是全局变量"


作用域链:

课程中简单解释了概念:内部函数访问外部函数变量,采用的是链式查找的方式来决定取那个值,这种结果我们称为作用域链。

看一个简单的例子:

 var   a=100;

function fn(){

    console.log(a);

}

fn();//100;

其实也存在一些特殊情况,这种情况能更加深入帮我们了解作用域中自由变量的取值。

var a=100;

function  fn()

{

      console.log(a);

}


function fn2(fn){

   var  a=200;

    fn();

}

fn2(fn);//100

对于自由变量的赋值,我们常常会说到父作用域中取值,但是针对于上面这种情况,显然是不成立的。

那么,在上述例子中,fn函数中,x的值到底到哪个作用域中取呢?

答案是,要到创建fn函数的那个作用域中取,无论fn函数在何处被调用。

作用域中取值,这里强调的是“创建”,而不是“调用”。


关于作用域和作用域链呢,因为我接触的还少,目前我可以接触到并接受的,就是以上内容,如果有更深层次的内容,欢迎补充


【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。