是否可以在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>

只需在函数外部声明它,并在函数内部赋值即可。喜欢的东西:

<script type="text/javascript">
    var offsetfrommouse = [10, -20];
    var displayduration = 0;
    var obj_selected = 0;
    var trailimage = null ;  // Global variable
    function makeObj(address) {
        trailimage = [address, 50, 50];  // Assign value

或者简单地从函数内部的变量名中删除“var”也会使它成为全局的,但为了代码更干净,最好在外部声明一次。这也可以:

var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;

function makeObj(address) {
    trailimage = [address, 50, 50];  // Global variable, assign value

我希望这个例子能解释更多:http://jsfiddle.net/qCrGE/

var globalOne = 3;
testOne();

function testOne()
{
    globalOne += 2;
    alert("globalOne is :" + globalOne );
    globalOne += 1;
}

alert("outside globalOne is: " + globalOne);

testTwo();

function testTwo()
{
    globalTwo = 20;
    alert("globalTwo is " + globalTwo);
    globalTwo += 5;
}

alert("outside globalTwo is:" + globalTwo);

只是声明

var trialImage;

在外面。然后

function makeObj(address) {
    trialImage = [address, 50, 50];
    ...
    ...
}

不,你不能。只需在函数外部声明变量即可。你不必在赋值的同时声明它:

var trailimage;

function makeObj(address) {
  trailimage = [address, 50, 50];

正如其他人所说,你可以在全局作用域(在所有函数和模块之外)使用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声明的全局变量都是窗口对象的属性。(新的let、const和class语句[在ES2015中添加]在全局作用域中创建的全局变量不是全局对象的属性;ES2015的新概念。)

(还有隐式全局变量的可怕之处,但不要故意这样做,尽量避免意外地这样做,也许可以使用ES5的“use strict”。)

综上所述:如果可能的话,我会避免全局变量(而且几乎可以肯定)。正如我所提到的,它们最终是窗口的属性,而窗口已经足够拥挤了,所有带有id的元素(以及许多只有名称的元素)都被转储到其中(不管即将到来的规范是什么,IE都会转储任何带有名称的元素)。

相反,在现代环境中,使用模块:

<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>

这很简单。在函数外部定义trailimage变量,并在makeObj函数中设置其值。现在您可以从任何地方访问它的值。

var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;
var trailimage;

function makeObj(address) {
    trailimage = [address, 50, 50];
    ...
}

如果你正在创建一个启动函数,你可以这样定义全局函数和变量:

function(globalScope)
{
    // Define something
    globalScope.something()
    {
        alert("It works");
    };
}(window)

因为函数是通过这个参数全局调用的,所以这里是全局作用域。所以,这个东西应该是全球性的。


如果你读了评论,就会发现关于这个命名约定的讨论很不错。

似乎自从我的回答发布后,命名惯例变得更加正式了。教书、写书的人会谈论var声明和函数声明。

下面是支持我观点的另一篇维基百科文章:声明和定义 ...来回答主要问题。在函数之前声明变量。这将工作,它将遵守在作用域顶部声明变量的良好实践:)


典型的例子:

window.foo = 'bar';

一个现代的,安全的例子,通过使用IIFE遵循最佳实践:

;(function (root) {
    'use strict'

    root.foo = 'bar';
)(this));

现在,也有使用WebStorage API的选项:

localStorage.foo = 42;

or

sessionStorage.bar = 21;

在性能方面,我不确定它是否比在变量中存储值明显慢。

广泛的浏览器支持,如“我可以使用....”所述


这取决于你对“全球”这个词的理解。如果你想要一个变量的全局作用域用于函数使用(这是OP想要的),那么你应该在编辑后阅读。如果希望在不使用服务器的情况下在页面之间重用数据,则应该使用sessionStorage。


会话存储

    var Global = 'Global';

    function LocalToGlobalVariable() {

        // This creates a local variable.

        var Local = '5';

        // Doing this makes the variable available for one session
        // (a page refresh - it's the session not local)

        sessionStorage.LocalToGlobalVar = Local;

        // It can be named anything as long as the sessionStorage
        // references the local variable.
        // Otherwise it won't work.
        // This refreshes the page to make the variable take
        // effect instead of the last variable set.

        location.reload(false);
    };

    // This calls the variable outside of the function for whatever use you want.

    sessionStorage.LocalToGlobalVar;

我知道这里面可能有很多语法错误,但这是大意……非常感谢LayZee指出这一点…您可以在http://www.w3schools.com/html/html5_webstorage.asp上找到什么是本地存储和会话存储。我需要同样的东西为我的代码,这是一个非常好的想法。


范围

在2015年,一个新的javascript“标准”(如果你愿意的话)被引入。这个标准为javascript引入了许多新思想,其中之一就是作用域的实现。

https://www.w3schools.com/js/js_scope.asp上有关于这一想法的所有细节,但cliff指出:

Const定义了一个常量。

Var具有“全局”作用域。

让有“函数”或“块”范围。


下面是示例代码,可能会有帮助。

var Human = function() {
    name = "Shohanur Rahaman";  // Global variable
    this.name = "Tuly"; // Constructor variable 
    var age = 21;
};

var shohan = new Human();

document.write(shohan.name + "<br>");
document.write(name);
document.write(age); // Undefined because it's a local variable 

在这里我找到了一个很好的答案:如何在JavaScript中声明全局变量?


下面是另一个简单的方法,可以让变量在其他函数中可用,而不必使用全局变量:

函数 makeObj() { var 轨迹图像 = '测试'; makeObj.trailimage = 'test'; } 函数 someOtherFunction() { document.write(makeObj.trailimage); } makeObj(); someOtherFunction();


使用window对象不是一个好主意。正如我在评论中看到的,

'use strict';

function showMessage() {
    window.say_hello = 'hello!';
}

console.log(say_hello);

这将抛出一个使用say_hello变量的错误,我们需要首先调用showMessage函数。


JavaScript中有三种作用域:

全局作用域:变量在代码中可用。 块作用域:变量在特定区域内可用,就像函数一样。 局部作用域:变量在更特定的区域可用,如if语句

如果在变量名之前添加Var,那么它的作用域将确定其位置


例子:

var num1 = 18; // Global scope
function fun() {
  var num2 = 20; // Local (Function) Scope
  if (true) {
    var num3 = 22; // Block Scope (within an if-statement)
  }
}

num1 = 18; // Global scope
function fun() {
  num2 = 20; // Global Scope
  if (true) {
    num3 = 22; // Global Scope
  }
}

全局变量在函数外部声明,以便在整个程序中访问,而局部变量存储在函数中,使用var,仅在该函数的作用域内使用。如果你声明一个变量没有使用var,即使它在函数中,它仍然会被视为全局变量。 参考资料= https://www.freecodecamp.org/news/global-variables-in-javascript-explained/


是的,你可以。不要用var,不要用let。只需初始化变量,它将自动被分配为全局:

    function firstFunction() {
        if (typeof(testVar) === "undefined") {testVar = 1;} //initializing variable if not initialized
        testVar += 1;
        console.log('Test variable inside 1st function: '+testVar);
    }
    function secondFunction() {
        testVar += 1;
        console.log('Test variable inside 2nd function: '+testVar);
    } 
    firstFunction();
    secondFunction();
    testVar += 1;
    console.log('Test variable outside: '+testVar);

所有声明的变量都没有“var”或“let”或任何前面的东西,如“const”,都是全局变量。所以…

function myFunction(){

     myVar = "value"; // myVar is a global variable and can be used anywhere inside <script> tags.

}

作为全局变量的替代方案,您可以使用浏览器的localstorage(如果不使用旧版本)。您最多可以使用5MB的存储空间。 代码是

var yourvariablevalue = 'this is a sample value';
localStorage.setItem("yourKeyvariablename", yourvariablevalue);

它可以在任何时候被取回,甚至在你离开并在其他时间打开它之后。

var yourvariablevalue = localStorage.getItem("yourKeyvariablename");

希望这对你有所帮助!