在 JavaScript 函数中定义全局变量

小编典典

在 JavaScript 函数中定义全局变量

all

是否可以在 JavaScript 函数中定义全局变量？

我想在其他函数中使用trailimage变量（在makeObj函数中声明）。

<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title></title>
        <script type="text/javascript">
            var offsetfrommouse = [10, -20];
            var displayduration = 0;
            var obj_selected = 0;
            function makeObj(address) {
                **var trailimage = [address, 50, 50];**
                document.write('<img id="trailimageid" src="' + trailimage[0] + '" border="0"  style=" position: absolute; visibility:visible; left: 0px; top: 0px; width: ' + trailimage[1] + 'px; height: ' + trailimage[2] + 'px">');
                obj_selected = 1;
            }

            function truebody() {
                return (!window.opera && document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body;
            }
            function hidetrail() {
                var x = document.getElementById("trailimageid").style;
                x.visibility = "hidden";
                document.onmousemove = "";
            }
            function followmouse(e) {
                var xcoord = offsetfrommouse[0];
                var ycoord = offsetfrommouse[1];
                var x = document.getElementById("trailimageid").style;
                if (typeof e != "undefined") {
                    xcoord += e.pageX;
                    ycoord += e.pageY;
                }
                else if (typeof window.event != "undefined") {
                    xcoord += truebody().scrollLeft + event.clientX;
                    ycoord += truebody().scrollTop + event.clientY;
                }
                var docwidth = 1395;
                var docheight = 676;
                if (xcoord + trailimage[1] + 3 > docwidth || ycoord + trailimage[2] > docheight) {
                    x.display = "none";
                    alert("inja");
                }
                else
                    x.display = "";
                x.left = xcoord + "px";
                x.top = ycoord + "px";
            }

            if (obj_selected = 1) {
                alert("obj_selected = true");
                document.onmousemove = followmouse;
                if (displayduration > 0)
                    setTimeout("hidetrail()", displayduration * 1000);
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <img alt="" id="house" src="Pictures/sides/right.gif" style="z-index: 1; left: 372px;
            top: 219px; position: absolute; height: 138px; width: 120px" onclick="javascript:makeObj('Pictures/sides/sides-not-clicked.gif');" />
        </form>
    </body>
</html>

阅读 99

2022-03-06

共1个答案

小编典典

正如其他人所说，您可以var在全局范围内（在所有函数和模块之外）使用来声明全局变量：

<script>
var yourGlobalVariable;
function foo() {
    // ...
}
</script>

（请注意，这仅在全局范围内有效。如果该代码在模块中<script type="module">...</script>- - - -
它不会在全局范围内，因此不会创建全局。）

或者：

globalThis在现代环境中，您可以分配给引用
(globalThis是在 ES2020 中添加的)的对象上的属性：

<script>
function foo() {
    globalThis.yourGlobalVariable = ...;
}
</script>

在浏览器上，您可以对全局调用做同样的事情window：

<script>
function foo() {
    window.yourGlobalVariable = ...;
}
</script>

…因为在浏览器中，所有声明的全局变量全局变量var都是window对象的属性。（在最新的规范 ECMAScript 2015
中，全局范围内的 new let、const和class语句创建不是全局对象属性的全局变量；ES2015 中的一个新概念。）

（隐式全局变量也很可怕，但不要故意这样做，尽量避免意外这样做，也许是使用 ES5 的"use strict"。）

所有这一切：如果可能的话，我会避免使用全局变量（而且几乎可以肯定）。正如我所提到的，它们最终成为 , 的属性window，并且window已经
足够拥挤 了，所有带有 a 的元素id（以及许多只有 a
的元素name）都被倾倒在其中（并且无论即将推出的规范，IE 都会倾倒任何带有 aname的东西）。

相反，在现代环境中，使用模块：

<script type="module">
let yourVariable = 42;
// ...
</script>

模块中的顶级代码位于模块范围内，而不是全局范围内，因此这会创建一个该模块中的所有代码都可以看到的变量，但这不是全局的。

在没有模块支持的过时环境中，将您的代码包装在一个作用域函数中并使用该作用域函数的本地变量，并在其中使您的其他函数闭包：

<script>
(function() { // Begin scoping function
    var yourGlobalVariable; // Global to your code, invisible outside the scoping function
    function foo() {
        // ...
    }
})();         // End scoping function
</script>

2022-03-06