<JavaScript>闭包

闭包

一.什么是闭包

函数和其周围的状态(词法环境)的引用捆绑在一起形成闭包。

通俗的说,闭包是一个函数,它可以访问其它函数作用域中的变量。

二.闭包的本质

函数在执行的时候会放到一个执行栈上当函数执行完毕之后会从执行栈上移除,但是堆上的作用域成员因为被外部引用不能释放,因此内部函数依然可以访问外部函数的成员。

闭包案例

//计算随机数字的多少幂次方
function makePower (power) {
    return function (x) {
        return Math.pow(x, power)
    }
}
let power2 = makePower(2)
let power3 = makePower(3)

power2(2) //4
power3(2) //8
//只执行一次
function once (fn) {
    let done = false
    return function () {
        if (!done) {
            done = true
            return fn.apply(this, arguments)
        }
    }
}

let pay = once(function (money) {
    console.log(`支付:${money} RMB`)
})

pay(5)//输出> 支付:5 RMB
pay(5)//输出> 空


  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div> <img src='images/1.jpg' height='150px' width='150px'> <img src='images/2.jpg' height='150px' width='150px'> <img src='images/3.jpg' height='150px' width='150px'> <img src='images/4.jpg' height='150px' width='150px'><br/> <button id="like-btn1">赞(<span id="like-count1">0</span>)</button> <button id="like-btn2">赞(<span id="like-count2">0</span>)</button> <button id="like-btn3">赞(<span id="like-count3">0</span>)</button> <button id="like-btn4">赞(<span id="like-count4">0</span>)</button> </div> <script type="text/javascript"> // 闭包方式实现点赞功能1 var like = (function() { var count = 0; return function() { count++; document.getElementById("like-count1").innerHTML = count; } })(); // 监听点击事件并调用闭包函数1 document.getElementById("like-btn1").addEventListener("click", like); // 闭包方式实现点赞功能2 var like = (function() { var count = 0; return function() { count++; document.getElementById("like-count2").innerHTML = count; } })(); // 监听点击事件并调用闭包函数2 document.getElementById("like-btn2").addEventListener("click", like); // 闭包方式实现点赞功能3 var like = (function() { var count = 0; return function() { count++; document.getElementById("like-count3").innerHTML = count; } })(); // 监听点击事件并调用闭包函数3 document.getElementById("like-btn3").addEventListener("click", like); // 闭包方式实现点赞功能4 var like = (function() { var count = 0; return function() { count++; document.getElementById("like-count4").innerHTML = count; } })(); // 监听点击事件并调用闭包函数2 document.getElementById("like-btn4").addEventListener("click", like); </script> </body> </html>改正代码
06-01

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值