极客笔记JavaScript 如何创建私有变量
闭包、符号、弱映射、类私有字段和代理是几种可以用来在JavaScript中创建私有变量的技术。每种技术都有优点和缺点，因此选择最适合您要求的技术非常关键。
和许多其他编程语言一样，JavaScript也有私有和公共变量的概念。私有变量只能被同一作用域中的代码访问和更改，而公共变量可以被任何代码访问和更改。让我们来看一下在JavaScript中创建私有变量的不同技术。
使用闭包
闭包方法是在JavaScript中创建私有变量的一种方法。如果一个函数可以访问其父函数作用域中定义的变量，即使父函数已经执行并返回，那么这个函数就是一个闭包。我们可以在函数内部定义一个变量，使其成为一个只能被该函数内部的代码访问的私有变量。
示例
<html>
<body>
<div id="demo"></div>
<script>
function createPrivateVariable() {
let privateVariable = "This is a private variable";
return {
getValue: function () {
return privateVariable;
},
setValue: function (value) {
privateVariable = value;
},
};
}
let privateVar = createPrivateVariable();
document.getElementById("demo").innerHTML = privateVar.getValue();
</script>
</body>
</html>
在上面的示例中，函数 createPrivateVariable 返回一个具有方法 getValue 和 setValue 的对象。这些方法可以检索或更改父函数中声明的 privateVariable 的值，因为它们可以访问它。如果尝试从函数外部访问privateVariable会导致引用错误。
使用Symbol数据类型
使用Symbol数据类型是创建私有变量的第二种方法。符号可以用作属性键，因为它们是不同的、非字符串的标识符。由于它们是唯一的，所以不能被外部程序轻易访问或修改。
let privateVariable = Symbol();
let obj = {
[privateVariable]: "This is a private variable"
};
console.log(obj[privateVariable]);
示例
我们可以按照上面的代码使用如下：
<html>
<body>
<div id="demo"></div>
<script>
let privateVar = Symbol();
let obj = {
[privateVar]: "This is a private variable"
};
Object.defineProperty(obj, 'getValue', {
get: function() {
return obj[privateVar];
}
});
document.getElementById("demo").innerHTML = obj.getValue;
</script>
</body>
</html>
在这个示例中，定义了一个名为privateVariable的Symbol，并将其用作对象的属性键。因为它是一个Symbol，所以不能使用点符号获取属性的值，但可以通过使用方括号符号在对象中访问它。
使用WeakMaps
WeakMaps可以用作构造私有变量的第三种方法。JavaScript引擎只对WeakMap中的键值对进行弱引用，这样可以将对象与键相关联。这使得误保持对私有变量的引用更加困难，因为如果没有其他对键的引用，垃圾回收器将销毁键值对。
示例
<html>
<body>
<div id="demo"></div>
<script>
let privateVariables = new WeakMap();
let obj = {};
privateVariables.set(obj, "This is a private variable");
document.getElementById("demo").innerHTML = privateVariables.get(obj);
</script>
</body>
</html>
在这个示例中，我们创建了一个名为privateVariables的WeakMap，用于保存对象的私有变量。使用get()方法可以在使用set()方法将私有变量与对象连接后获取私有变量。但是，私有变量不能从对象形成的作用域外部访问，因为只有在有对象的引用时才能访问。
使用面向对象的类语法
也可以使用面向对象的类语法来创建私有变量。JavaScript的class关键字使我们能够定义类，类可以作为对象的模板。一个类可以用#符号在变量名前定义一个私有变量；这是一个实验性功能，表示一个私有变量。目前不建议在生产代码中使用此功能，因为它目前并没有广泛支持。
示例
<html>
<body>
<p id="output"></p>
<script>
class MyClass {
#privateVariable = "This is a private variable";
getValue() {
return this.#privateVariable;
}
setValue(value) {
this.#privateVariable = value;
}
}
let obj = new MyClass();
document.getElementById("output").innerHTML = obj.getValue(); // "This is a private variable"
obj.setValue("New value");
document.getElementById("output").innerHTML = obj.getValue(); // "New value"
</script>
</body>
</html>
在这个示例中，一个名为 MyClass 的类被构建，使用了私有变量 #privateVariable ， getValue 和 setValue 。如果类外的方法尝试访问只能通过类内方法访问的私有变量，将会引发引用错误。
使用代理对象
最后，使用代理对象是构建私有变量的另一种选择。一个可以用来拦截或改变其他对象行为的对象被称为代理。你可以通过将对象封装在代理中，使私有变量只能被具有代理的代码访问。
示例
<html>
<body>
<div id="demo"></div>
<script>
let privateVariable = "This is a private variable-proxy obj.";
let handler = {
get: function (target, name) {
if (name === "privateVariable") {
return privateVariable;
}
},
set: function (target, name, value) {
if (name === "privateVariable") {
privateVariable = value;
}
},
};
let obj = new Proxy({}, handler);
document.getElementById("demo").innerHTML = obj.privateVariable;
</script>
</body>
</html>
在这个示例中，我们建立了一个带有getter和setter方法的Proxy处理程序。这些方法可以获取或更改在Proxy之外定义的私有变量的值，并对其进行访问。但是，由于引用错误，私有变量无法从Proxy外部访问。