local局部作用域:
闭包的形成:
function outer (){ var num =10; function inner(){ console.log(num) } inner() }
outer()
闭包的保持
function outer (){ var num =10; function inner(){ console.log(num) } return inner } var f = fn();//接受了inner内部函数。 fn();//f访问了内部的函数
也可以这样写。
function fn(){ var num = 10; return function (){ //返回的函数 也是高阶函数。 console.log(num) } } var f = fn(); f();
闭包的作用:延伸了作用域的范围。
5闭包案例:
1循环注册点击事件:
<ul class="nav"> <li>草莓</li> <li>苹果</li> <li>榴莲</li> <li>橘子</li> </ul> <script> var lis = document.querySelector('.nav').querySelectorAll('li'); for (var i = 0; i < lis.length; i++){ lis[i].index = i lis[i].onclick = function () { console.log(this.index); } } for (var i = 0; i < lis.length; i++) { (function(i){//()()立即执行函数。第二个()相当于直接执行函数。立即函数,也成为了小闭包。都可以使用i的变量。 console.log(i); lis[i].onclick = function(){ console.log(i); } })(i); } </script>
案例2: 3秒后,打印所有的li的元素内容。
// var lis = document.querySelector('.nav').querySelectorAll('li'); // for (var i = 0; i<lis.length;i++){ // setTimeout(function(){ // console.log(lis[i].innerHTML); // },0); // //定时器,事件onclick ,ajax,回调函数 // } var lis = document.querySelector('.nav').querySelectorAll('li'); for (var i = 0; i<lis.length;i++){ (function (i){ setTimeout(function(){ console.log(lis[i].innerHTML); },3000) })(i); //定时器,事件onclick ,ajax,回调函数 }