一、作用域
定义:在js中,作用域为变量,对象,函数可访问的一个范围。
分类:全局作用域和局部作用域
全局作用域:全局代表了整个文档document,变量或者函数在函数外面声明,那它的就是全局变量和全局函数。之所以全局变量在这个文档的任何位置都可以访问是因为它是window下的属性,window是一个全局对象,它本身在页面中任何位置可以用,同样它身上的属性在页面的任何位置也是可以用的。
声明全局作用域的方法:把变量或者是函数放在函数外声明或者变量不用var声明直接赋值(不管是在函数内还是函数外它都是一个全局变量).要避免使用全局变量,声明变量的时候一定要加上var.
<script>
var x = 3; //在函数外,全局变量
function fn1() {
var c = 10; //函数内,局部变量,它的范围仅限于该函数,函数运行完成后,函数内定义的变量将会自动销毁
c += 3;
a=18;
console.log(c); //13
x += 10; // 在函数内修改了全局变量后,全局变量就完成了修改,外面调用时,也是修改后的
}
fn1();
console.log(x, "______"); //13 "______"
b=20;
console.log(a);// 18 没有用var声明,虽在函数内声明但也是全局变量
console.log(window); //可以看到a,b,x
</script>
<script>
console.log(x,a); //13 18 在这也可以访问
</script>
局部作用域:变量在函数内声明,变量为局部作用域。只能在函数内部访问。所以不同函数可以使用相同名称的变量。函数执行完后局部变量会自动销毁。函数可以嵌套,嵌套的函数可以访问父函数里的内容。
声明局部作用域的方法:var 变量,function 函数名(){}.
<script>
function fn() {
var a = 20;
var b = 30;
function fn1() {
console.log(a + b); //50 嵌套函数可以访问父函数里的内容
}
fn1();
}
fn();
// console.log(a,b); //报错 a,b是局部变量,在外面访问不到
// fn1();//报错 fn1是局部函数,在外面也是问不到的
//全局变量与局部变量重名
var s1 = 10;
function fn1() {
var s1 = 20;
s1 += 20;
window.s1 += 10; //如果全局变量的名称在函数中和局部变量相同,想要调用全局变量时要在前面加上window前缀
console.log(s1); //40
}
fn1();
console.log(s1); //20 在函数内全局变量进行了改变
var s2 = 10;
function fn2() {
console.log(s2); //undefined 函数当中有定义局部变量,函数作用范围内所有位置都是这个局部变量,
//此函数中下文定义了局部变量s2,但是这里是在定义之前调用的,所以s2的值为undefined
s2 += 10;
console.log(s2); //NaN undefined加数字为NaN
var s2 = 20;
}
fn2();
</script>
二、作用域链
可以简单的将作用域链理解为变量与函数的查找规则。
查找规则:如是一个函数需要用到一个变量,那它会先在自己的作用域里去找这个变量,如果自己有那它就直接用自己的,如果自己没有,那它就会一层层向外面找,直到找到外层的变量,找到后就用外层的变量(只会向外,不会向内找)。
<script>
var a = 20;
function fn() {
console.log(a); //20 先在自己的作用域找,没找去父级身上找,在父级身上找到a为20
}
fn();
function fn1() {
var a = 13
console.log(a) //13 //自己作用域里的a为13
}
fn1();
</script>