老生常谈之js闭包

164 阅读1分钟

闭包作为JavaScript中的重要特性之一,不论是开发还是面试中,都经常会见到它的身影。

闭包有两个常见的通途:

  • 限制变量的作用域,实现变量私有化
  • 函数中的变量始终保存在内存中不被销毁(所以闭包需要合理使用,不然会带来额外的内存开销)

举个栗子

常见的例子就是计数器


var counter = 0;
function add() {
   return counter += 1;
}

如上所示,每调用一次addcounter就会增加1,但是由于counter是全局变量。所以计数器add形同虚设,外部可以通过直接修改counter的值达到修改计数器。 这时可能会有人抖个机灵,那就把var counter = 0;放在函数add中啊。


function add() {
var counter = 0;
   return counter += 1;
}
add()
add()
add()
// 1
// 1
// 1

果然,不出意外的,三次调用计数器后,counter的值依旧为1,只是因为每次调用完了add之后,系统会释放变量counter,然后下次执行的时候再初始化,所以不论运行少次,结果都是1。这样虽然实现了变量的私有化,但是却没法让变量常驻内存了。

解决办法

利用闭包

var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();

add();      // 1
add();      // 2
add();      // 3

//函数自调用,然后返回一个匿名函数,这时形成了一个不被销毁的栈环境