JavaScript--变量作用域

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>Title</title>
  6 </head>
  7 <body>
  8 <button>按钮1</button>
  9 <button>按钮2</button>
 10 <button>按钮3</button>
 11 </body>
 12 </html>
 13 <script>
 14     /**
 15      *      《函数》
 16      *          匿名函数
 17      *              语法格式:function(){}
 18      *                  只写匿名函数在JS报错
 19      *
 20      *          函数创建
 21      *              1.函数的声明
 22      *                  function fn(){
 23      *                  }
 24      *              2.函数表达式
 25      *                  var fn = function(){
 26      *                  }
 27      *
 28      *           函数命名建议:
 29      *              动词+名词
 30      *
 31      *           函数参数:
 32      *              和PHP一样,分为形参和实参
 33      *
 34      *           函数返回值:
 35      *              关键词:return
 36      *              !与PHP区别:JS函数内部都有返回值,默认返回undefined
 37      *
 38      *           arguments对象 (实参在函数体内的集合)
 39      *              所有函数都内置了一个arguments对象,是一个伪数组.
 40      *
 41      *           自调用函数
 42      *              (function(){})();
 43      *              ;(function(){})();      严谨写法
 44      *                  自调用函数相当于是沙箱,小闭包,内部创建的变量,函数和外部不受关联。
 45      *                  作用:防止全局变量污染。
 46      *
 47      */
 48 
 49     // 全局变量,在<script> 顶级创建的变量是全局变量
 50 /*  var data = "CCTV";
 51     ;(function () {
 52         alert(data); // "CCTV"
 53     })();
 54     ;(function () {
 55         alert(data); // "CCTV"
 56     })();
 57     alert(data); // "CCTV"*/
 58 
 59 
 60 
 61     /*var data = "CCTV";
 62     ;(function () {
 63         var data = "湖南卫视";
 64         alert(data); // "湖南卫视"
 65     })();
 66     ;(function () {
 67         alert(data); // "CCTV"
 68     })();
 69     alert(data); // "CCTV"*/
 70 
 71 
 72 
 73    /* var data = "CCTV";
 74     ;(function () {
 75     //函数体内变量如果没有var声明,它会逐级往上查找,
 76     //如果外面还是没有声明,JS内部会把这个变量设置成全局变量
 77     //!!!! 这是很危险的操作,全局变量污染很容易影响到其他同事的代码
 78         data = "湖南卫视";
 79         alert(data); // "湖南卫视"
 80     })();
 81     ;(function () {
 82     //函数体内变量如果没有var声明,他会逐级往上查找
 83         data = "广东卫视";
 84         alert(data); // "广东卫视"
 85     })();
 86     alert(data); // "广东卫视"*/
 87 
 88 
 89 
 90    /*//变量作用域-事件1
 91     var btns = document.getElementsByTagName('button');
 92     btns[0].onclick = function () {
 93         var tv = "湖南卫视";
 94     }
 95     alert(tv); // tv is not defined*/
 96 
 97 
 98    /* //变量作用域-事件2
 99     var btns = document.getElementsByTagName('button');
100     btns[0].onclick = function () {
101         // 事件处理程序内的函数,如果不触发,永远不执行
102         tv = "湖南卫视";
103     }
104     alert(tv); // tv is not defined*/
105 
106 
107   /*  //变量作用域-事件3
108     var btns = document.getElementsByTagName('button');
109     btns[0].onclick = function () {
110         // 事件处理程序内的函数,如果不触发,永远不执行
111         tv = "湖南卫视"; // 这样会污染全局变量,不推荐使用
112     }
113     btns[1].onclick = function () {
114         alert(tv); // 事件是触发才执行,这里要分情况
115 //        1,先点击按钮1,再点击按钮2,弹出湖南卫视
116 //        2,先点击按钮2,不点击按钮1,控制台报错:dv is not defined
117     }*/
118 
119   
120    /* //变量作用域-事件3
121     var btns = document.getElementsByTagName('button');
122     var tv; //定义变量tv
123     btns[0].onclick = function () {
124         // 事件处理程序内的函数,如果不触发,永远不执行
125         tv = "湖南卫视"; // 这样会污染全局变量,不推荐使用
126     }
127     btns[1].onclick = function () {
128         alert(tv); // 事件是触发才执行,这里要分情况
129 //        1,先点击按钮1,再点击按钮2,弹出湖南卫视
130 //        2,先点击按钮2,不点击按钮1,弹出undefined
131     }*/
132 </script>

 

转载于:https://www.cnblogs.com/mrszhou/p/7665831.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值