JS闭包代码疑问：为何三次调用add()后counter值为3？

先看你的代码：

var add = (function () { var counter = 0; return function () {return counter += 1;} })();
add();
add();
add(); // the counter is now 3

这事儿的核心是闭包（Closure），我给你一步步掰明白：

• 首先，最外层的(function () { ... })();是个立即执行函数表达式（IIFE）——它定义完就立刻自己执行了。执行的时候，它在自己的内部作用域里创建了一个局部变量counter，初始值设为0。
• 这个立即执行函数没有直接返回counter，而是返回了一个匿名函数：function () {return counter += 1;}。然后我们把这个返回的函数赋值给了变量add。
• 这里的关键来了：当内部的匿名函数被外部的add变量“抓”住的时候，它就形成了闭包。闭包的特性是，它会牢牢记住自己诞生的那个词法环境（也就是立即执行函数的作用域），哪怕这个外层函数已经执行完了，它的作用域也不会被浏览器的垃圾回收机制干掉，里面的counter变量自然也不会消失。
• 所以每次你调用add()，其实是在调用那个被返回的匿名函数，它会直接去访问之前保留的那个counter变量，每次给它加1——根本不会重新创建一个新的counter，自然也就不会重置啦。

打个比方：立即执行函数就像一个带锁的小箱子，counter是箱子里的数字纸条，add是唯一能打开这个箱子的钥匙。你每次用钥匙（调用add），都是打开同一个箱子去改里面的纸条数字，而不是每次都重新做一个新箱子放新纸条～

内容的提问来源于stack exchange，提问作者manifestor