Javascript 闭包

闭包是高阶函数中的一种，高阶函数 是接收一个函数作为参数 或者是返回一个函数

闭包 指有权访问念一个作用域中变量的函数

简单的理解 ：一个函数作用域可以访问念外一个作用域中的局部变量

闭包的主要作用是延伸了作用域的范围

function fun() {
    let num = 10;
    function fn() {
        console.log(num); // 在fn作用域中能访问 fun中的作用域 ，说明有闭包的产生
    }
    fn() 
}
fun()

function fun() {
    let num = 10;
    // function fn() {
    //     console.log(num); 
    // }
    // return fn
    return function () {
        console.log(num); 
    }
}
let f = fun()
f() // 在全局作用域能访问到 fun中num局部作用域 ，说明有闭包的产生

闭包案例1 输出当前点击小li 索引号

<nav>
    <li>1</li>
    <li>2</li>
    <li>3</li>
</nav>

// 添加动态属性的方式 ，比较操蛋
var lis = document.querySelector('nav').querySelectorAll('li')
for (var i=0;i < lis.length ;i++){ 
    lis[i].index = i 
    lis[i].onclick = function () { // for循环是同步的 代码一执行i就等于3 了，而点击事件是异步的，故每次点击都是3
        console.log(this.index);
    }
}

// 立即执行函数里面的任何一个函数都能访问i 这个变量
for (var i=0;i < lis.length ;i++){
    // 利用for创建4个立即执行函数
    (function (i) {
       lis[i].onclick = function() {
           console.log(i); // 访问外部的参数
       } 
    })(i) // 立即执行函数传参
}

// 最简单的方式
for (let i=0;i < lis.length ;i++){ 
    lis[i].onclick = function () { 
        console.log(i);
    }
}