Blog
首页
文档
收藏
关于
  • 在线转换时间戳 (opens new window)
  • 在线压缩图片 (opens new window)
  • Float-Double转二进制 (opens new window)
  • 文件转Hex字符串 (opens new window)

HiuZing

🍑
首页
文档
收藏
关于
  • 在线转换时间戳 (opens new window)
  • 在线压缩图片 (opens new window)
  • Float-Double转二进制 (opens new window)
  • 文件转Hex字符串 (opens new window)
  • 前端面试题

  • JavaScript

    • JavaScript语法

      • JavaScript-数据类型
      • JavaScript-ES6编程风格
      • JavaScript-异步编程
      • JavaScript-Promise
      • JavaScript-Proxy
      • JavaScript-Reflect
      • JavaScript-Iterator
      • JavaScript-Module
      • JavaScript-拷贝
      • JavaScript-this
      • JavaScript-垃圾回收机制
      • JavaScript-闭包
        • let和const
        • JavaScript-参数默认值
        • JavaScript-rest
        • JavaScript-扩展运算符
        • JavaScript-Symbol
        • JavaScript-生成器
        • JavaScript-class类
        • JavaScript-数值扩展
        • JavaScript-高阶函数
        • JavaScript-箭头函数
      • JavaScipt对象

      • JavaScript实例

      • JavaScript浏览器BOM

      • JavaScript DOM

    • Vue2

    • port

    • CSS

    • Node.js

    • JavaScript优化

    • uniapp

    • Mini Program

    • TypeScript

    • 面向对象编程

    • UI组件

    • Plugin

    • Vue3

    • 性能优化

    • Axios

    • 状态管理

    • React

    • Mock

    • Icon

    • Template

    • 构建工具

    • 项目规范配置

    • Taro

    • SVG

    • React Native

    • 前端
    • JavaScript
    • JavaScript语法
    HiuZing
    2023-04-06
    目录

    JavaScript-闭包

    # 概念:

    一个函数对周围状态的引用捆绑在一起,内层函数中访问到其外层函数的作用域

    简单理解:闭包 =内层函数 + 外层函数的变量

    // 简单的写法
    function outer(){
        let a = 10
        function fn(){
            console.log(a)
        }
        fn()
    }
    outer()
    
    1
    2
    3
    4
    5
    6
    7
    8
    9

    image-20230406132633672

    # 闭包作用

    封闭数据,提供操作,外部也可以访问函数内部的变量

    允许将函数与其所操作的某些数据(环境)关联起来

    // 常见闭包形式
    function outer(){
        let a = 10
        function fn(){
            console.log(a)
        }
        return fn()
    }
    // outer() === fn === function fn(){console.log(a)}
    // const fun = function fn(){console.log(a)}
    const fun = outer()
    fun() // 调用函数
    
    // 外面要使用10 
    // 外面需要调用内部的函数,而不是获取这个函数的值
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15

    # 闭包应用

    实现数据的私有

    案例:我们要做个统计函数调用次数,函数调用一次,就++

    image-20230406135045889

    外部函数的作用就说缩小变量的作用域,外部无法修改局部变量,从而达到数据私有化,真正需要执行的是内部函数,因此需要返回这个内部函数

    因为i是局部变量,直接调用count(),使用完回摧毁变量值

    每次调用count,实际上调用了fn,fn里面的i一直在累加

    function count(){
        let i = 0
        function fn(){
            i++
            console.log(`函数被调用${i}次`)
        }
        return fn
    }
    const fun = count()
    //fun指向fn,因为fn是count返回值,count在全局调用,fn用到i++,i++用到let i = 0,因此在全局中,能找到i,不会被回收。i虽然在局部中,但i不会被回收 
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10

    # 闭包问题

    内存泄漏

    上次更新: 2024/08/14, 04:14:33
    JavaScript-垃圾回收机制
    let和const

    ← JavaScript-垃圾回收机制 let和const→

    最近更新
    01
    React Native 使用SVG
    08-13
    02
    Docker基础命令
    08-04
    03
    算数逻辑单元
    07-30
    更多文章>
    Theme by Vdoing | Copyright © 2021-2024 WeiXiaojing | 友情链接
    • 跟随系统
    • 浅色模式
    • 深色模式
    • 阅读模式