wake-up-neo.com

Definieren Sie globale Variablen in einer JavaScript-Funktion

Ist es möglich, eine globale Variable in einer JavaScript-Funktion zu definieren?

Ich möchte die Variable trailimage (deklariert in der Funktion makeObj) in anderen Funktionen verwenden.

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

Ja, wie die anderen gesagt haben, können Sie var im globalen Bereich (außerhalb aller Funktionen) verwenden, um eine globale Variable zu deklarieren:

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

Alternativ können Sie eine Eigenschaft für window zuweisen:

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

... weil in Browsern alle globalen Variablen Mit var deklarierte globale Variablen sind Eigenschaften des Objekts window. (In der neuesten Spezifikation, ECMAScript 2015, werden mit den neuen Anweisungen let, const und class im globalen Bereich Globals erstellt, die keine Eigenschaften des globalen Objekts sind. Ein neues Konzept in ES2015.)

(Es gibt auch den Schrecken impliziter globaler Variablen , aber tu es nicht absichtlich und tu dein Bestes, um es nicht versehentlich zu tun, vielleicht indem du ES5s "use strict" verwendest. )

Alles, was gesagt wurde: Ich würde globale Variablen vermeiden, wenn Sie können (und Sie können es mit ziemlicher Sicherheit). Wie ich bereits erwähnte, sind sie Eigenschaften von window, und window ist bereits genug überfüllt ​​ was mit allen Elementen mit einem id (und vielen mit nur) ein name) wird darin abgelegt (und unabhängig von der bevorstehenden Spezifikation gibt IE fast alles mit einem name ab).

Binden Sie Ihren Code stattdessen in eine Bereichsfunktion ein, verwenden Sie lokale Variablen für diese Bereichsfunktion und schließen Sie Ihre anderen Funktionen:

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

UPDATE1: Wenn Sie die Kommentare lesen, gibt es eine nette Diskussion um diese spezielle Namenskonvention.

UPDATE2: Es scheint, dass die Namenskonvention seit meiner Antwort formeller geworden ist. Leute, die unterrichten, Bücher usw. schreiben, sprechen über die Erklärung var und function.

UPDATE3: Hier ist der zusätzliche Wikipedia-Beitrag, der meinen Standpunkt unterstützt: http://en.wikipedia.org/wiki/Declaration_ (computer_programming) #Declarations_and_Definitions

... und um die Hauptfrage zu beantworten. DECLARE-Variable vor Ihrer Funktion. Dies funktioniert und entspricht der bewährten Methode, Ihre Variablen am oberen Rand des Bereichs zu deklarieren :)

17
op1ekun

Einfach deklarieren

var trialImage;

draußen. Dann

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

Hoffe das hilft.

14
harihb

Nein, kannst du nicht. Deklarieren Sie einfach die Variable außerhalb der Funktion. Sie müssen es nicht gleichzeitig mit der Zuweisung des Werts deklarieren:

var trailimage;

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

Deklarieren Sie es einfach außerhalb der Funktionen und weisen Sie Werte innerhalb der Funktionen zu. So etwas wie:

<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

Durch einfaches Entfernen von "var" aus Ihrem Variablennamen innerhalb der Funktion wird diese ebenfalls global, es ist jedoch besser, sie für einen saubereren Code einmal außerhalb zu deklarieren. Dies wird auch funktionieren:

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

function makeObj(address) {
    trailimage = [address, 50, 50];  //GLOBAL VARIABLE , ASSIGN VALUE

Ich hoffe, dieses Beispiel erklärt mehr: 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);
10
DhruvPathak

Es ist sehr einfach, die Variable trailimage außerhalb der Funktion zu definieren und ihren Wert in der Funktion makeObj festzulegen. Jetzt können Sie von überall auf den Wert zugreifen.

var offsetfrommouse = [10, -20];
var displayduration = 0;
var obj_selected = 0;
var trailimage;
function makeObj(address) {
      trailimage = [address, 50, 50];
      ....
}
3
Bharath
    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 - Its 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;

Ich stelle fest, dass es wahrscheinlich viele Syntaxfehler gibt, aber es ist die allgemeine Idee ... Vielen Dank LayZee, dass Sie darauf hingewiesen haben ... Sie können herausfinden, was ein lokaler und Session-Speicher ist http: // www.w3schools.com/html/html5_webstorage.asp . Ich habe dasselbe für meinen Code gebraucht und das war eine wirklich gute Idee.

2
ShanerM13

Klassisches Beispiel:

window.foo = 'bar';

Modernes, sicheres Beispiel nach bewährten Methoden mit einem IIFE :

;(function (root) {
    'use strict'

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

Heutzutage gibt es auch die Möglichkeit, die WebStorage API zu verwenden

localStorage.foo = 42;

oder

sessionStorage.bar = 21;

Performancemäßig bin ich mir nicht sicher, ob es merklich langsamer ist als das Speichern von Werten in Variablen.

Umfassende Browserunterstützung gemäß Kann ich verwenden ...