函数作用域及变量提升（作用域链）
关于函数的相关初识，函数在Js中是不可或缺的一部分，功能十分强大，所用到的地方呢也非常多，提到函数，函数的知识点很多。定义一个函数，需要function 函数名 （参数）{函数体}。函数需要调用才能使用，创建函数名的时候命名规则与变量的命名一样。不能重复命名，重复命名最终只会生效一个，后写的会将先写的覆盖掉。其中，又要提到作用域的概念，什么是作用域。在函数内部的称为局部变量，在函数外部的称为全局变量。在js中，有个概念叫做作用域链，总结来说，就是从函数内部向外部寻找的一个过程，形成一个作用域链。变量提升：在js中，运行时先将文档中的变量和函数都预览一遍，然后在按照从上往下的顺序运行代码，此过程称为变量提升。
作用域：
<!DOCTYPE html>
<head>
<title>Document</title>
</head>
<body>
<script>
// 作用域及作用域链
// 作用域:变量或函数的有效使用范围，有全局作用域和局部作用域两种
// 全局变量： 函数外声明的变量，在任何地方都可以被修改和访问。
// 局部变量: 函数内声明的变量，只能在函数内被修改和访问。
// 作用域链：是js内部中的一种变量，函数查找机制，它决定了变量和函数的作用范围，向上查找的方式
// 全局函数
function fn() {
var b = 10//局部变量
console.log('111');
}
//全局变量
var a = 10
console.log(window.a);
window.fn()
// 在window上的属性和函数可以省略window
// var a=20
// function fn() {
// var b = 10//局部变量
// console.log(a); //20
// console.log(b); //10
// }
// fn()
// console.log(b);//报错 局部变量b只在函数内有效 出了函数就会被垃圾回收机制回收
// 作用域链：是js内部中的一种变量，函数查找机制，它决定了变量和函数的作用范围，向上查找的方式
// var a=20
// function fn() {
// var b = 10//局部变量
// // 变量a在函数内作用域中没有，就会向上查找
// console.log(a); //20
// console.log(b); //10
// }
// fn()
var a=50
function ff(){
var b=10
console.log(a); // 50 向上查找的机制
gg()
function gg(){
var c=90 //gg函数的局部变量
console.log(a); //向上查找的机制
console.log('111');
console.log(c); //在本身的局部作用域中就有
}
// gg()
// console.log(c) //报错
}
ff()
// gg() //报错 局部函数
function sum(){
var a=10
console.log(a); //10
// console.log(c);//报错
function s(){
var c=20
}
s()
}
sum()
console.log(c); //报错
</script>
</body>
</html>
变量提升：
<!DOCTYPE html>
<head>
<title>Document</title>
</head>
<body>
<script>
// 变量提升：浏览器在解析js代码的时候，会先进行一个预解析的操作，会有一个js解析器
// js解析器，会执行其中的两个步骤
// 1、找 var function (找变量)
// 2、逐行解析
// 1、找 var function (找变量)
// 1、1 如果存在var 关键词，则会将这个变量 存起来 形式：var a; 并且提到最前面
// 1.2 找函数 如果存在函数则整体(不包含函数的调用)提到前面
// 1.3 逐行排列解析
// 函数调用的时候 ，在函数内部也会执行以上两个步骤
// var b;
// function s(){
// console.log('111');
// }
// console.log(b); //undefined
// b = 10
// s()
// console.log(c);
// var c = 10
// function s() {
// console.log(c);
// console.log(g);
// var g = 20
// }
// s()
// console.log(c);
// console.log(g);
/*
var c;
function s(){
console.log(c); var g;
console.log(g); console.log(c); //10
var g=20 console.log(g); //undefined
} g=20
console.log(c);//undefined
c=10
s()
console.log(c); //10
console.log(g); //局部变量不能再外面访问
*/
var a=30
var c;
function s(){
console.log(c); //undefined
c=50
console.log(a); // 30
var k=80
function gg(){
console.log(k); //80
}
gg()
}
console.log(c);//undefined
s()
console.log(c);//50
/*
var a;
var c;
function s(){
console.log(c);
c=50
console.log(a);
var k=80
function gg(){
console.log(k);
}
}
a=30
console.log(c);
s()
var k;
function gg(){
console.log(k);
}
console.log(c);
c=50
console.log(a);
k=80
gg()
*/
</script>
</body>
</html>
