JavaScript 闭包怎么用

你有没有过这种经历：在网上看到一个有意思的互动小游戏，点一下按钮就弹出一句专属问候，换个用户名字，弹出的话还能自动跟着变？这种能“记住”之前信息的小功能，背后就藏着JavaScript里一个很实用的知识点——闭包。

很多人听到“闭包”就觉得是复杂的专业术语，其实它一点都不抽象，咱们用生活里的小事就能讲明白。先从一个简单的场景说起：假设你在做一个留言板，需要记录每个用户的留言次数，第一次留言要显示“第1次留言”，第二次显示“第2次”。如果用普通的函数来写，可能会写成这样：

`javascript

let count = 0;

function addMessage() {

count += 1;

console.log(第${count}次留言);

}

`

但这里有个问题：如果同时有两个用户，比如小明和小红，他们的留言次数会互相干扰——小明留言后count变成1，小红再留言就会从1开始，而不是重新从0算。这就像你把两个笔记本的密码写在同一个本子上，谁都能改，乱套了。

这时候闭包就派上用场了。简单说，闭包就是“函数能记住自己外部变量的能力，而且这些变量不会被外面的其他函数随便改”。咱们把刚才的例子改一改：

`javascript

function createCounter() {

let count = 0; // 这个变量只能被内部的函数访问

return function() {

count += 1;

console.log(第${count}次留言);

};

}

// 给小明单独做一个计数器

const xiaomingCounter = createCounter();

// 给小红单独做一个计数器

const xiaohongCounter = createCounter();

`

你看，createCounter外面的代码根本碰不到count这个变量，每个用createCounter做出来的计数器，都有自己独立的“小账本”。试一下调用：

`javascript

xiaomingCounter(); // 输出：第1次留言

xiaomingCounter(); // 输出：第2次留言

xiaohongCounter(); // 输出：第1次留言

`

是不是解决了之前的问题？这就是闭包最常用的场景之一——给每个独立的需求，配上专属的“记忆空间”。

除了做独立计数器，闭包还有一个很生活化的用法：保存临时状态。比如你做一个网页的主题切换功能，需要记住用户上次选的是浅色还是深色，下次打开页面直接用这个设置。用闭包就能把这个状态藏起来，不会被其他代码误改：

`javascript

function createTheme() {

let currentTheme = 'light'; // 默认浅色

return function(theme) {

if (theme) {

currentTheme = theme; // 改主题的时候更新状态

}

console.log(当前主题：${currentTheme});

};

}

const userTheme = createTheme();

userTheme('dark'); // 改成深色

userTheme(); // 输出：当前主题：dark，不用每次都传参数

`

这个currentTheme就像你手机里的主题设置，只有你自己的切换函数能改，别的程序没法随便动，安全又好用。

当然，闭包也不是万能的，用的时候要注意一个小问题：如果大量用闭包，这些“小账本”会一直存在内存里，不会自动消失，就像你攒了一堆不用的旧笔记本，占地方。所以平时用的时候，不用的闭包可以手动清空，避免浪费资源。

其实JavaScript里很多你每天用的功能，都悄悄用到了闭包——比如电商网站里每个商品的加入购物车计数，朋友圈里的点赞次数，甚至你刷短视频时的播放记录，都靠闭包来“私藏”各自的小数据。它不像听起来那么高深，就是让函数带着自己的专属记忆干活的小工具，用好它，就能轻松解决很多“数据乱串”的小麻烦。