javascript变量作用域
javascript变量作用域
一、简介
1.全局变量：声明在函数外部的变量（所有没有var直接赋值的变量都属于全局变量）
2.局部变量：声明在函数内部的变量（所有没有var直接赋值的变量都属于全局变量）
JS中变量申明分显式申明和隐式申明。
vari=100;//显式申明
i=100;//隐式申明
在函数中使用var关键字进行显式申明的变量是做为局部变量，而没有用var关键字，使用直接赋值方式声明的是全局变量。
当我们使用访问一个没有声明的变量时，JS会报错。而当我们给一个没有声明的变量赋值时，JS不会报错，相反它会认为我们是要隐式申明一个全局变量，这一点一定要注意。
全局作用域针对于全局变量来说;
1 <script type="text/javascript">
2 alert(c);//输出undefind
3 // alert(d);报错错
4 var c=3;
5 function test(){
6 var a=1;
7 b=2;
8 alert(c)//输出三
9 }
10 alert(c);//输出3
11 test();
12 </script>
全局变量在整个上下文都有效只是在没有赋值之前调用，会输出undefin
函数作用域是针对局部变量来说的，在函数中定义的变量在函数外不能获取
1 function test(){
2 alert(a);//声明未赋值输出undefine
3 var a=1;
4 alert(a);//1
5 }
6 // alert(a);报错，外部获取不到
7
8 test();
9 //alert(a);保存不能输出
块级作用域
概念“{}”中间的部分都是块级作用域ex：for while if ，js中没有块级作用域，但是可以用闭包实现类似功能。
1 <script type="text/javascript">
2 var i=1;
3 if(i==1){
4 var b=2;
5 }
6 alert(b);//输出2
7 for(var j=0;j<=2;j++){
8 var c=3;
9 }
10 alert(c);//输出3
11 </script>
二、实例
1 <!DOCTYPE html> 2 <html lang="zh-cn"> 3 <head> 4 <meta charset="utf-8"> 5 <title>课堂演示</title> 6 </head> 7 <body> 8 <script> 9 //函数的参数都是按值传递的 10 // var num = 100; 11 // function box(num){ 12 // num+=100; 13 // return num; 14 // } 15 // var result = box(num); 16 // alert(result); 17 // alert(num);//这里输出100而不是200 18 19 </script> 20 <script> 21 // var name = "张三"; //定义全局变量 22 // //alert(name) 23 // //alert(window.name); //全局变量，最外围，属于window属性 24 25 // function setName(){ 26 // return "李四"; 27 // } 28 // //alert(setName()); 29 // //alert(window.setName()); //全局函数，最外围，属于window方法 30 </script> 31 <script> 32 var name = "张三"; //定义全局变量 33 function setName(){ 34 //var name= "李四"; //定义局部变量 35 name="李四"; //去掉var变成了全局变量 36 //alert(name); 37 } 38 setName() 39 alert(name); 40 </script> 41 42 </body> 43 </html>
1 <!DOCTYPE html> 2 <html lang="zh-cn"> 3 <head> 4 <meta charset="utf-8"> 5 <title>课堂演示</title> 6 </head> 7 <body> 8 <!DOCTYPE html> 9 <html lang="zh-cn"> 10 <head> 11 <meta charset="utf-8"> 12 <title>课堂演示</title> 13 </head> 14 <body> 15 <script> 16 function setName(){ 17 var name="张三" 18 function setYear(){ //setYear()方法的作用域在setName()内 19 var age=21; 20 var str=name+age+'岁了' 21 return str; 22 } 23 //alert(setYear()) 24 //alert(age) 25 return setYear() 26 } 27 setName() 28 // alert(setYear()) 29 alert(setName()); 30 </script> 31 </body> 32 </html> 33 </body> 34 </html>
1、关注这里的函数嵌套
