在JavaScript中使用全局函数是否有效?

5
我有一个关于全局脚本的问题,我现在正在使用以下脚本,因为这些函数在每个页面上都是全局使用的。(之前我有类似于单位转换器函数在8个地方定义,现在我将其移到全局脚本中,所以我只定义一次。)
我的问题是,这是一种有效的方式或最佳实践吗?我真的需要它们全局定义,并在其他脚本调用这些方法之前加载。
我已经搜索过了,像这样的文章建议不要使用全局函数。https://www.w3schools.com/js/js_best_practices.asp

避免全局变量

最小化使用全局变量。

这包括所有数据类型、对象和函数。

全局变量和函数可以被其他脚本覆盖。

使用本地变量,学习如何使用闭包。

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
        /*-----------------------------------------------------
            global function for Set/Get Cookie
        ------------------------------------------------------*/
        function setCookie(cname,cvalue,exdays) {
            var d = new Date();
            d.setTime(d.getTime() + (exdays*24*60*60*1000));
            var expires = "expires=" + d.toGMTString();
            document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
        }
    
        function getCookie(name) {
            var value = "; " + document.cookie;
            var parts = value.split("; " + name + "=");
            if (parts.length == 2) return parts.pop().split(";").shift();
        }
        /*-----------------------------------------------------
            global function for ...
        ------------------------------------------------------*/
        function getLBS_Global(p, q, u, b, wb) {
        if (b === null || wb === null) {
            alert("Error in unit conversion, please retry");
        }
        var out = {};
        switch (u) {
            case "8": // A bushel
                out.q = (q * b);
                out.p = (p / b);
                break;
            case "10": // lbs
                out.q = q;
                out.p = p;
                break;
            case "11": // cwt
                out.q = (q * 100);
                out.p = (p / 100);
                break;
            case "12": // metric tonne
                out.q = (q * 2204.62262);
                out.p = (p / 2204.62262);
                break;
            case "136": // W bushel
                out.q = (q * wb);
                out.p = (p / wb);
                break;
        }
        return out;
    }
    </script>
</head>
<body>
...
</body>

3
嗯,是的。这是完全有效和最佳实践。 - Praveen Kumar Purushothaman
最好将其封装成一个对象,这样就不会与其他函数名称冲突,但如果所有代码都是由您编写的,则不需要这样做... - Jonas Wilms
1
@PraveenKumar 谢谢,因为我听到了不同选择的人,现在感觉好多了 ;D - Dalin Huang
2个回答

4

是的,它是有效的。

如果您不想污染全局范围(并避免名称冲突),最佳实践是将函数包装在对象内,并将该对象公开到全局范围。

这是一个示例,但思路是根据其行为捆绑函数在一起。

<script type="text/javascript">
  (function(global){

    function setCookie(cname,cvalue,exdays) {
        var d = new Date();
        d.setTime(d.getTime() + (exdays*24*60*60*1000));
        var expires = "expires=" + d.toGMTString();
        document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
    }

    function getCookie(name) {
        var value = "; " + document.cookie;
        var parts = value.split("; " + name + "=");
        if (parts.length == 2) return parts.pop().split(";").shift();
    }

    global.bundleObj = {
      setCookie: setCookie,
      getCookie: getCookie
    }

  })(window)
</script>

然后在您的代码中任何地方

<script>
  window.bundleObj.setItem()
</script>

谢谢,当我调用那些函数时,我使用 global.stuff.setCookie() 吗? - Dalin Huang
我已经编辑了我的回答。只需使用 window :) 我在函数内部使用全局变量使其更通用。 - Karim
1
这看起来更好,打包函数确实很有意义,定义全局函数的方式也更好。感谢您的帮助! - Dalin Huang

2

是的,这看起来很好。如果您在整个页面上都在使用它,那么最好将其定义在全局范围内。唯一建议不这样做的原因是如果您有很多函数或代码与其他人编写的代码交织在一起。如果它相当简短且没有其他人参与,那么这种方法更容易。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接