作用域概述
-
通工厂常来来说说一段程序代码中所用到的名字并不总是有效和可靠的,而限定这个名字的可用性代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突
-
分类:
- 全局作用域:整个 script 标签,或者是一个单独的 js 文件
- 局部作用域(函数作用域):在函数内部,这个代码的名字只在函数内部起效果和作用
变量作用域
- 分类:
- 全局变量:在全局作用域下的变量
- 局部变量:在局部作用域下(函数内部)的变量
- 注意:如果在函数内部没有声明直接赋值的变量也属于全局变量
- 注意:函数的形参实际上就是局部变量
- 注意:js 在 es6 的时候新增了块级作用域
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
var num = 10;
console.log(num);
function fn() {
num3 = 30; // 注意:如果在函数内部没有声明直接赋值的变量也属于全局变量
var num2 = 20;
}
fn();
console.log(num3);
console.log(num2);
</script>
</head>
<body>
</body>
</html>
- 从执行效率来看全局变量和局部变量
- 全局变量只有浏览器关闭的时候才会销毁,比较占内存资源
- 局部变量在我们程序执行完毕就会销毁,比较节约内存资源
作用域链
- 只要是代码,就只有一个作用域
- 写在函数内部的局部作用域
- 如果函数中还有函数,那么在这个作用域中就又可以诞生一个作用域
- 根据在内部函数可以访问外部函数变量的这种机制,用链式 查找决定哪些数据能被内部函数访问就称作作用域链
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
var num = 20;
function fn() {
var num = 10;
function fun() {
console.log(num); // 返回10,就近原则
}
fun();
}
fn();
</script>
</head>
<body>
</body>
</html>