|
|
@@ -0,0 +1,110 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>Document</title>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <ul>
|
|
|
+ <li>1</li>
|
|
|
+ <li>2</li>
|
|
|
+ <li>3</li>
|
|
|
+ <li>4</li>
|
|
|
+ <li>5</li>
|
|
|
+ </ul>
|
|
|
+ <script>
|
|
|
+ var aLi = document.getElementsByTagName("li");
|
|
|
+
|
|
|
+ for(var i=0;i<aLi.length;i++){
|
|
|
+ // 函数的参数也属于局部变量
|
|
|
+ (function(i){
|
|
|
+ aLi[i].onclick = function(){
|
|
|
+ console.log(i)
|
|
|
+ }
|
|
|
+ })(i);
|
|
|
+ }
|
|
|
+
|
|
|
+ // for(var i=0;i<aLi.length;i++){
|
|
|
+ // (function(){
|
|
|
+ // var val = i;
|
|
|
+ // aLi[i].onclick = function(){
|
|
|
+ // console.log(val)
|
|
|
+ // }
|
|
|
+ // })();
|
|
|
+ // }
|
|
|
+ // for(var i=0;i<aLi.length;i++){
|
|
|
+ // function fn(){
|
|
|
+ // var val = i;
|
|
|
+ // aLi[i].onclick = function(){
|
|
|
+ // console.log(val)
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // fn();
|
|
|
+ // }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // 闭包
|
|
|
+ // 函数嵌套函数 内部函数可以使用外部函数的变量 且外部的局部变量不会释放
|
|
|
+
|
|
|
+ // function fn(){
|
|
|
+ // // 局部变量 仅在函数内生效 外部不能访问
|
|
|
+ // // 在函数内定义的变量为局部变量
|
|
|
+ // var a = 10;
|
|
|
+ // }
|
|
|
+ // fn();
|
|
|
+ // console.log(a);
|
|
|
+
|
|
|
+
|
|
|
+ // function fn(){
|
|
|
+ // var a = 1;
|
|
|
+ // ++a;
|
|
|
+ // console.log(a);
|
|
|
+ // }
|
|
|
+ // fn();
|
|
|
+ // fn();
|
|
|
+
|
|
|
+
|
|
|
+ // function fn(){
|
|
|
+ // var a = 1;
|
|
|
+ // function fn2(){
|
|
|
+ // a++;
|
|
|
+ // console.log(a);
|
|
|
+ // }
|
|
|
+ // fn2();
|
|
|
+ // fn2();
|
|
|
+ // }
|
|
|
+ // fn();
|
|
|
+
|
|
|
+
|
|
|
+ // js 有一种垃圾回收机制
|
|
|
+ // 当一个函数执行完毕后 函数内的变量会被销毁
|
|
|
+ // 但是如果函数内嵌套了函数 那么外部函数的变量不会被销毁
|
|
|
+ // 这就是闭包
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // 定义私有变量 不被别人使用 可以使用闭包
|
|
|
+
|
|
|
+ // function fn(){
|
|
|
+ // var a = 10;
|
|
|
+ // function fn2(v){
|
|
|
+ // a = a+v;
|
|
|
+ // console.log(a);
|
|
|
+ // }
|
|
|
+ // return fn2;
|
|
|
+ // }
|
|
|
+ // var f = fn();
|
|
|
+ // // console.log(f);
|
|
|
+ // f(1);
|
|
|
+ // f(2);
|
|
|
+ // f(10);
|
|
|
+ // console.log(a)
|
|
|
+
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|
