博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript的闭包
阅读量:6162 次
发布时间:2019-06-21

本文共 1793 字,大约阅读时间需要 5 分钟。

一、前言

在学习了作用域之后,我们知道函数的AO不一定会被释放,那么利用这个特性,闭包(closure)应运而生。

二、闭包原理

函数嵌套函数,函数的AO通过作用域链相互连接起来,使得函数体内的变量都可以保存在函数的AO中,于是外部环境就能利用函数作用域内的变量,这样的特性称为“闭包”。

我们看一下代码:

function outer() {    var scope = 'outer';    function inner() {        return scope;    }    return inner;}var fn = outer();console.log(fn()); // 'outer'复制代码

解析:在inner的作用域链中拷贝着其父级函数outer的作用域链,因此当函数outer执行完成之后,抛出的函数inner的作用域链中依然有outer的作用域链,产生一个闭包,这样就可以在全局环境下使用outer中的变量了。

三、闭包的应用

1. 实现公有变量

// 一个累加器function add() {    var count = 0;    function addAction() {        count++;        console.log(count);    }    return addAction;}var myAdd = add();myAdd(); // 1myAdd(); // 2myAdd(); // 3复制代码

2. 缓存存储结构

function add2() {    var count2 = 0;    function addAction2() {        count2++;        return count2;    }    function clearAction() {        count2 = 0;        return count2;    }    return [addAction2, clearAction];}var myAdd2 = add2();console.log(myAdd2[0]()); // 1console.log(myAdd2[0]()); // 2console.log(myAdd2[0]()); // 3console.log(myAdd2[0]()); // 4// 清除一下console.log(myAdd2[1]()); // 0console.log(myAdd2[0]()); // 1console.log(myAdd2[0]()); // 2console.log(myAdd2[0]()); // 3复制代码

3. 封装功能(实现属性的私有化,避免变量公有的污染)

function counter() {    var count3 = 0;    var adder = {        addAction3: function() {            count3++;            console.log(count3);        },        clearAction: function() {            count3 = 0;            console.log(count3);        }    }    return adder;}var myCounter = counter();myCounter.addAction3(); // 1myCounter.addAction3(); // 2myCounter.addAction3(); // 3myCounter.clearAction(); // 0myCounter.addAction3(); // 1myCounter.addAction3(); // 2复制代码

四、闭包的危险

1. 造成原有的AO不释放,产生内存泄漏(memory leak),影响内存消耗,进而影响性能。

2. 如果公有变量,那么是有可能会污染全局变量的。

五、本节思维导图

源码地址:

转载于:https://juejin.im/post/5d070d8de51d4510664d16d4

你可能感兴趣的文章
unix环境高级编程-高级IO(2)
查看>>
树莓派是如何免疫 Meltdown 和 Spectre 漏洞的
查看>>
雅虎瓦片地图切片问题
查看>>
HTML 邮件链接,超链接发邮件
查看>>
HDU 5524:Subtrees
查看>>
手机端userAgent
查看>>
pip安装Mysql-python报错EnvironmentError: mysql_config not found
查看>>
http协议组成(请求状态码)
查看>>
怎样成为一个高手观后感
查看>>
[转]VC预处理指令与宏定义的妙用
查看>>
MySql操作
查看>>
python 解析 XML文件
查看>>
MySQL 文件导入出错
查看>>
java相关
查看>>
由一个异常开始思考springmvc参数解析
查看>>
向上扩展型SSD 将可满足向外扩展需求
查看>>
虚机不能启动的特例思考
查看>>
SQL Server编程系列(1):SMO介绍
查看>>
在VMware网络测试“专用VLAN”功能
查看>>
使用Formik轻松开发更高质量的React表单(三)<Formik />解析
查看>>