闭包

青丝为谁绾
111 阅读2分钟

什么是闭包？

闭包就是能够读取其他函数内部变量的函数。

通俗地说函数a的内部函数b，被函数a外部的一个变量引用的时候，就创建了一个闭包。

  function a() {
            let i = 0;
            function b() {
                alert(++i);
            }
            return b;
        }

        const c = a();
        c();//外部的变量   =>1

闭包优缺点及使用场景？

优点

  1. 可以从内部函数访问外部函数的作用域中的变量，且访问到的变量长期驻扎在内存中，可供之后使用
  2. 避免变量污染全局
  3. 把变量存到独立的作用域，作为私有成员存在

缺点

  1. 对内存消耗有负面影响。因内部函数保存了对外部变量的引用，导致无法被垃圾回收，增大内存使用量，所以使用不当会导致内存泄漏解决（不再使用的变量赋值为Null）
  2. 对处理速度具有负面影响。闭包的层级决定了引用的外部变量在查找时经过的作用域链长度
  3. 可能获取到意外的值(captured value)

应用场景

  • 模块封装 vue中data()函数
  • 定时器封装
  • ajax
  • 函数防抖节流

定时器

function autorun() {
            let x = 1;
            setTimeout(function log() {
                console.log(x);
            }, 10000);
        };
        autorun()//1

ajax

(function autorun(){
    let x = 1;
    fetch("http://").then(function log(){
      console.log(x);
    });
})();

原理

函数执行分成两个阶段(预编译阶段和执行阶段)。

  • 在预编译阶段，如果发现内部函数使用了外部函数的变量，则会在内存中创建一个“闭包”对象并保存对应变量值，如果已存在“闭包”，则只需要增加对应属性值即可。
  • 执行完后，函数执行上下文会被销毁，函数对“闭包”对象的引用也会被销毁，但其内部函数还持用该“闭包”的引用，所以内部函数可以继续使用“外部函数”中的变量

利用了函数作用域链的特性，一个函数内部定义的函数会将包含外部函数的活动对象添加到它的作用域链中，函数执行完毕，其执行作用域链销毁，但因内部函数的作用域链仍然在引用这个活动对象，所以其活动对象不会被销毁，直到内部函数被烧毁后才被销毁

avatar
文章
阅读
粉丝