JavaScript中的闭包的定义及常见应用场景

翻滚的胖子
2023-06-20 09:42:17
JavaScript

闭包是JavaScript中一个重要的概念，它可以让我们更好地理解函数的作用域、变量等。接下来，我们将详细介绍JavaScript中的闭包，以及它的常见应用场景。

一、闭包的定义

闭包是指有权访问另一个函数作用域中变量的函数，即在函数内部创建另一个函数时，可以访问外部函数的变量。

我们来看一个简单的闭包例子：

function outer() {  
    var num = 10;  
    function inner() {  
        alert(num);  
    }  
    return inner;  
}  
var getNum = outer();  
getNum();  //输出结果为10

在上面的代码中，outer函数内部定义了变量num，并返回了inner函数。在外部调用outer函数后，赋值给getNum变量，因为getNum变量指向的是inner函数，所以调用getNum函数时，会访问到outer函数中的变量num，最终输出结果为10。

二、常见应用场景

1. 计数器

闭包可以用来实现计数器的功能，代码实现如下：

function counter() {  
    var num = 0;  
    return function() {  
        num++;  
        console.log(num);  
    }  
}  
var count = counter();  
count();  //输出结果为1  
count();  //输出结果为2  
count();  //输出结果为3

在上面的代码中，counter函数返回了一个匿名函数，该匿名函数可以访问外部函数中的变量num。每次调用count函数时，都会将num加1，并输出num的值。

2. 创建私有变量

闭包还可以用来创建私有变量，代码实现如下：

var person = function() {  
    var name = "";  
    return {  
        setName: function(newName) {  
            name = newName;  
        },  
        getName: function() {  
            return name;  
        }  
    }  
}();  
person.setName("Tom");  
console.log(person.getName());  //输出结果为Tom

在上面的代码中，我们通过闭包来创建了一个私有变量name，并通过返回一个包含两个方法的对象来访问和修改该变量。这样，我们就可以在外部访问和修改该变量了。

3. 封装

闭包还可以用来封装变量和函数，防止变量和函数污染全局作用域。代码实现如下：

var utils = (function() {  
    var name = "Tom";  
    function getName() {  
        return name;  
    }  
    return {  
        getName: getName  
    }  
})();  
console.log(utils.getName());  //输出结果为Tom

在上面的代码中，我们通过闭包来封装了变量和函数，只暴露了一个getName方法在全局作用域中，防止了变量和函数的污染。