避免全局变量的正确方法

Question

有没有一种正确的方法(ES6 友好(来避免在我的 JavaScript 示例中使用全局变量？我看到我们可以使用一个函数将我们的代码包装在闭包?..

<textarea name="fileEdition" id="fileEdition" placeholder="Some content from a file, editable"></textarea>
<button id="saveFile">Save</button>
<script>
const files = document.querySelector('#RandomFileListGotInPHP');
const fileEdition = document.querySelector('#fileEdition');
const saveButton = document.querySelector('#saveFile');
function openFile() {
fileEditionBackup = fileEdition.value;    
}
function saveFile() {
console.log(`backup content before save in PHP: ${fileEditionBackup}`);
}
files.addEventListener('change', openFile);
saveButton.addEventListener('click', saveFile);
</script>

感谢您的帮助。

Answer 1

我看不出反对 IIFE 的理由：

(function () {
const files = document.querySelector('#RandomFileListGotInPHP');
const fileEdition = document.querySelector('#fileEdition');
const saveButton = document.querySelector('#saveFile');
function openFile() {
fileEditionBackup = fileEdition.value;    
}
function saveFile() {
console.log(`backup content before save in PHP: ${fileEditionBackup}`);
}
files.addEventListener('change', openFile);
saveButton.addEventListener('click', saveFile);
})();

当然，+function(){ ... }()或(_=>{ ... })()也可以。