本文主要是介绍关于JS中作用域的那些事儿,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
1、作用域
作用域
:是指JavaScript
中变量
和函数
的可访问性范围。
1.1、全局作用域
概念
:- 不被函数大括号
{}
包裹的部分:就是全局作用域
全局作用域
中声明的变量
称为全局变量
,全局变量
:可以在任何位置被访问全局变
量的生命周期
是永久的——在程序中存在的周期是永久的永久
:在程序打开后会创建一个window对象
,全局变量会放在window对象
上, 程序关闭时,window对象
会被销毁,- 也就是:只要window对象在,那么全局变量就在,如果全局变量被删除了,那就是window对象被删除了,什么时候
- 会删除全局变量:关闭页面,只要程序在,全局变量就在,相较于程序而言,全局变量的声明周期就是永久的
- 不被函数大括号
示例
:
var a = 10;console.log( window ); // 此时的window就是window对象 => 如果要去控制台查看最好声明以a/b开头,方便查找位置
全局变量弊端
:- 全局变量虽然访问特性非常方便,但是,全局变量也有其缺点,全局变量的存在会让我们的程序更"重",也就是占用的计算机资源会更多
- 因为全局变量都会放在window对象上,变量越多,window对象越大,那么越大就会占据更多的性能,会导致程序变卡等等
- 所以应该谨慎使用全局变量,尽可能多的使用
局部变量
1.2、局部作用域
概念
:- 被函数大括号
{}
包裹的部分就是局部作用域
- 局部作用域中,声明的变量称为:
局部变量
- 局部作用域只能在函数大括号
{}
中生效和访问,在外部无法正确访问 - 局部变量的
生命周期
是临时的,临时
—在函数执行时被创建,函数执行结束则立即被删除
- 被函数大括号
示例
:
function foo(){var a = 10; // 这个变量就是局部变量,可以在函数内部随意使用,但是在外部不能引用console.log( a );
}
foo();
console.log( a ); // 外部访问内部的a变量会直接报引用错误,也就是在全局作用域中,无法访问局部作用域里声明的变量
注意
:函数的行参也是局部变量,只能在函数中使用- 示例:
function foo( a ){ // 这里的参数a相当于 var a ==> 和局部变量的特性相同,也就意味着,参数只能在函数中使用,在函数外是用不了的// 代码块
}
2、示例
在
全局作用域
声明的变量
,局部作用域里
是否可以引用
// 回答:可以,因为全局变量可以在任何位置被访问
//示例:var a = 30;function foo(){console.log( a ); // 这里可以正常获取到a的值}foo();
3、作用域变量访问规则
规则分类:
访问规则
和赋值规则
3.1、访问规则
解释
:- 变量的访问规则也叫做:
作用域的查找机制
,这种访问规则,我们称为:作用域链
- 变量的访问规则也叫做:
规则内容
:当想要获取一个变量的值时,这个行为叫做访问
- 先在自己的作用域内部查找,如果有:就拿来使用;
- 如果没有,就向上一级去查找, 如果有:就拿来使用;
- 如果还没有,再继续向上一层查找,如果有:就拿来使用,以此类推…
- 如果一直找到全局作用域了,还没有找到想访问的变量,就会报出错误
- 错误类型:引用错误—变量 is not defined
注意
:- 作用域的查找机制:只能
向上(向外)不能向下
- 作用域的查找机制:只能
示例
:
// 注意:子集函数是可以获取父级函数的变量值的var num = 100;function foo(){var num2 = 200;function foo2(){var num3 = 300;console.log(num3); // 在自己的作用域中查找,找到了变量num3,直接访问其对应的值 => 值为300;console.log(num2); // 在自己的作用域中查找,没有变量num2,向上级作用域查找,找到对应的值 => 200;console.log(num); // 在自己的作用域中查找,没有变量num,向上级作用域查找,没有num,继续向上级查找到全局作用域,找到值 => 300console.log(a); // 在自己的作用域中查找,没有变量a,向上级查找,也没有变量a,在向上级查找到全局作用域,还是没有,此时会报错}foo2();}foo();
示例2
:查找机制只能向上不能向下
function poo(){console.log( a ); // 这里是不能向下访问的,也就无法获取a的值function innerPoo(){var a = 10;}
}
3.2、赋值规则
解释
:- 赋值规则 =赋值运算
- 当想要给变量赋值的时候,要先找到需要赋值的变量,然后再给这个变量赋值
规则内容
:- 先在自己的作用域内部查找,如果有:就直接赋值
- 没有就去上一级作用域查找,如果有:就直接赋值
- 如果还是没有,再去上一级作用域查找,以此类推…
- 如果一直找到全局作用域都没,就直接把这个变量定义为全局变量,然后再赋值
- 但是这种情况尽量不要发生,因为会有很多隐患
示例
:
function poo(){k = 10; // 在当前作用域查找,没有k变量,就会向上查找,但全局作用域中都未查找到这个变量,则s就会新创建一个变量k并赋值给它,此时k成为了全局变量
}
poo();
console.log( k ); // 此时在外层访问k这个全局变量是可以的,得到值为10
4、练习:判断变量a的值
var a = 10;
function poo(){var a = 20;console.log( a ); // 当前值为:20,因为优先访问内部的局部变量afunction pooInner(){a = 30;}pooInner() console.log( a ); // 值为:30,因为上面a = 30,优先赋值给内部的局部变量a
}
poo();
console.log( a ); // 值为:10,因为这里是直接在全局作用域访问的,所以它访问到的是全局变量a
这篇关于关于JS中作用域的那些事儿的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!