持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第16天，点击查看活动详情
JavaScript 作用域
1.全局变量与全局作用域
1.全局变量：在函数外声明的变量 。 2.全局变量有全局作用域：网页中所有脚本和函数均可使用全局变量，即可以在任意的范围访问全局变量。 3.如果变量在函数内没有声明（没有使用 var 关键字），该变量为全局变量。 【特殊】 4.全局变量的生命周期从它们被声明的时间开始。全局变量会在页面关闭后被自动销毁(删除)。
/* 1.全局变量与全局作用域_1 */
var carName = "Volvo";
console.log(carName);// 此处可调用carName变量
function myFunction() {
console.log(carName);// 函数内可调用carName变量
}
/* 1.全局变量与全局作用域_2 */
function myFunction2() {
carName = "Volvo"; //carName在函数内，但是为全局变量
console.log(carName);// 此处可调用carName变量
}
myFunction2();//加载时自动调用myFunction2函数
console.log(carName);// 此处可调用carName变量
function myFunction3 {
console.log(carName);// 此处可调用carName变量
}
2.局部变量与局部作用域
1.局部变量： 在函数内声明的变量。 2.局部变量有局部作用域：只能在声明变量的函数内部访问该局部变量。局部作用域又叫函数作用域。 3.因为局部变量只作用于函数内，所以不同的函数可以使用相同名称的变量。 4.局部变量的生命周期从它被声明的时间开始。局部变量会在函数执行完毕后被自动销毁(删除) 。
/* 2.局部变量与局部作用域 */
// 此处不能调用carName变量
function myFunction3() {
var carName = "Volvo";
// 函数内可调用carName变量
}
/* 2.局部变量与局部作用域_2 */
var n = 10;
function myFunction4() {
console.log(n); //undefined，把下面的var n = 5;注释掉将打印出10。
var n = 5;
}
console.log(n);
<button type="button" onclick="javascript:myFunction4()">点一下</button>
/* 2.局部变量与局部作用域_3 */
var m = 1;
function myFunction5(m) { //参数在函数中相当于一个局部变量，注意这个m与上面的m不是同一个
m = m + 3;
console.log(m);//8
}
console.log(m);//1
<button type="button" onclick="javascript:myFunction5(5)">点一下</button>
/* 2.局部变量与局部作用域_4 */
function myFunction6() {
var a = b = c = 2; //认为a是局部变量，b和c是全局变量，因为b和c前面没有var关键字
}
myFunction6(); //保存或者重新打开文件，会自动执行此处代码。
console.log(b); //2
console.log(c); //2
console.log(a); //a is not defined
3.变量提升
/* js程序执行前会将使用var关键字声明的变量提升所在作用域的最前面，但是赋值还是在原来的位置 */
var a = 10;
console.log(a); //10
console.log(a); //undefined//全局变量作用域提升
var a = 10;
/* 以上代码作用域提升后可以改写为 */
var a;
console.log(a); //undefined
a = 10;
function fn() {
console.log(b) //undefined//局部变量作用域提升
var b = 10;
}
作业：声明并初始化两个变量a和b，a初始化后的值为1，b初始化后的值为2，a为全局变量，b为局部变量，在控制台输出a与b的和，要求使用eval函数。
4.递归
递归：在函数的内部调用自己本身。默认是一个死循环，因此在使用递归的时候需要添加限制条件。
/* 1.死循环 */
var i = 0;
function say() {
i++;
console.log('hello_' + i);
say();
}
/* 2.添加限制条件避免死循环 */
var j = 0;
function say2() {
j++;
console.log('Hello_' + j);
if (j === 3) {
return; //结束函数体的执行
}
say2();
}
<button type="button" onclick="javascript:say()">点一下</button>
<button type="button" onclick="javascript:say2()">点一下2</button>
案例1：计算1-5之间所有整数的和
/* 3.案例1_计算1-5之间所有整数的和 */
function getSum(num) {
alert("num：" + num);
if (num == 1) {
return 1;
}
return num + getSum(num - 1);
}
function firstFunc(n) {
var a = getSum(n);
console.log("a：" + a);
}
<button type="button" onclick="javascript:firstFunc(5)">点一下3</button>
案例2：菲波那切数列
/* 4.案例2_菲波那切数列 */
function fb(n) {
if (n == 1 || n == 2) {
return 1;
}
return fb(n - 1) + fb(n - 2);
}
function secondFunc(n) {
var b = fb(n);
console.log("b：" + b); //fb(4)==fb(3)+fb(2)==fb(2)+fb(1)+fb(2)==1+1+1=3
}
