Javascript 多次声明同一个变量是一种好做法吗

以下是我的javascript代码：

(function(){
"use strict";
document.addEventListener("DOMContentLoaded",animations); /*on content loaded */


function animations() {


/*start of animation for the toggle navigation button in smaller view ports*/
(function () { 

    var button = document.getElementById('nav-icon');
    button.addEventListener('click', function(){
        if (this.classList.contains('active')===true) {
            this.classList.remove('active');
        }
        else {
            this.classList.add('active');
        }
    })

})();  /*End of the toggle navigation animation*/

/*Start of  scrolling side navigation for smaller view ports*/

(function(){

        var button = document.getElementById('nav-icon');
        var body = document.querySelector('body');
        button.addEventListener('click', function(){
        if (this.classList.contains('active')===true) {
            body.classList.add('active-nav');
        }
        else {
            body.classList.remove('active-nav');
        }

    });

    })(); /*End of scrolling side navigation*/


(function () {
        // body...
        var media = window.matchMedia("(min-width: 992px)");
        var body = document.querySelector('body');
        var button = document.getElementById('nav-icon');
        window.addEventListener('resize',function(){

            if (media.matches) {

                    body.classList.remove('active-nav');

                    if (button.classList.contains('active')===true) {

                        button.classList.remove('active');
                    }

                }


        });

    })();


};

})();

---

正如您所见，我在代码中多次声明了具有完全相同值的变量，但它们位于不同的函数中。每个iLife都是一个独立的动画，虽然它们可能共享相同的元素，但具有不同的功能。然而，我想知道这是否是一个好的做法。我是否应该在主函数中声明公共变量，以便它们可能位于所有子函数的执行上下文中？此外，请强调任何看起来不好或不好的做法。谢谢

变量仅在定义的范围内有效。因此，即使您有从DOM中获得相同值的变量，只要它们在作用域中（在本例中，只要您的函数正在执行），它们也只会在内存中

---

别担心

变量仅在定义的范围内有效。因此，即使您有从DOM中获得相同值的变量，只要它们在作用域中（在本例中，只要您的函数正在执行），它们也只会在内存中

---

别担心

在JavaScript中，

var

被提升到函数级别，因此它的作用域是函数。因为在不同的函数中使用相同的变量名，所以可以，因为它们存在于不同的作用域中

---

和@ @ TeaMeX和@ Bergi指出，在范围之外，如果变量是表示每个匿名函数中的相同数据，则考虑重构以提高可读性和代码维护性。

在JavaScript中，<代码> var >代码>被提升到函数级，因此它被作用于函数。因为在不同的函数中使用相同的变量名，所以可以，因为它们存在于不同的作用域中

---

和@ @ TeaMeX和@ Bergi指出，在范围之外，如果变量是在每个匿名函数中表示相同的数据，则考虑重构以提高可读性和代码维护性。

正如其他人所说的，但由于函数的范围，它是很好的。你应该知道，把这两条线移到他们生活之外是更好的做法（大约移到第4条线）

---

因此js只执行一次查找，而不是3次。这将缓存dom查找，这将提高性能。

正如其他人所说，由于函数范围的原因，这很好，但是，您应该知道，最好将这两行移到它们的生命周期之外（大约第4行）

---

因此js只执行一次查找，而不是3次。这将缓存dom查找，这将提高性能。

这不是一个坏做法，但是，例如

var body=document.querySelector（'body'）

可以简单地写成

var body=document.body不知道，谢谢！这是一种不错的做法，但是，例如
var body=document.querySelector（'body'）
可以简单地写成
var body=document.body不知道，谢谢！这几乎不会提高性能，dom查找非常便宜，不管它是一次还是三次发生。然而，它将在减少重复的同时提高代码质量。这几乎不会提高性能，dom查找非常便宜，不管它是一次还是三次。然而，它将提高代码质量，因为它减少了重复。
var button = document.getElementById('nav-icon'); 
var body = document.querySelector('body');