Wie deklariere ich eine globale Variable in JavaScript?

Wie kann ich eine globale Variable in JavaScript deklarieren?

Wenn Sie globale Variablen im Produktionscode generieren müssen (was vermieden werden sollte), deklarieren Sie diese immer explizit :

window.globalVar = "This is global!";

Während es möglich ist, eine globale Variable durch einfaches Weglassen zu definieren var(vorausgesetzt, es gibt keine lokale Variable mit demselben Namen), generiert dies eine implizite globale Variable , was eine schlechte Sache ist und im strengen Modus einen Fehler erzeugen würde .

Wenn dies die einzige Anwendung ist, in der Sie diese Variable verwenden, ist Felix 'Ansatz hervorragend. Wenn Sie jedoch ein jQuery-Plugin schreiben, sollten Sie die unter dem jQuery-Objekt erforderlichen "Namespace" -Variablen und -Funktionen berücksichtigen (Details zu den Anführungszeichen später ...). Zum Beispiel arbeite ich derzeit an einem jQuery-Popup-Menü, das ich miniMenu genannt habe. Daher habe ich einen "Namespace" definiert.miniMenu unter jQuery und alles dort platziert.

Der Grund, warum ich Anführungszeichen verwende, wenn ich über Javascript-Namespaces spreche, ist, dass sie nicht wirklich Namespaces im normalen Sinne sind. Stattdessen verwende ich einfach ein Javascript-Objekt und platziere alle meine Funktionen und Variablen als Eigenschaften dieses Objekts.

Der Einfachheit halber unterstelle ich den Plugin-Namespace normalerweise mit einem i Namespace für Dinge, die nur intern im Plugin verwendet werden sollten, um ihn vor Benutzern des Plugins zu verbergen.

So funktioniert es:

// An object to define utility functions and global variables on:
$.miniMenu = new Object(); 
// An object to define internal stuff for the plugin:
$.miniMenu.i = new Object();

Jetzt kann ich einfach etwas tun $.miniMenu.i.globalVar = 3oder $.miniMenu.i.parseSomeStuff = function(...) {...}wann immer ich etwas global speichern muss, und ich halte es trotzdem aus dem globalen Namespace heraus.

BEARBEITEN Die Frage bezieht sich auf JavaScript, die Antwort bezieht sich auf jQuery, was falsch ist. Dies ist eine alte Antwort aus Zeiten, als jQuery weit verbreitet war.

Stattdessen empfehle ich, Bereiche und Abschlüsse in JavaScript zu verstehen

Alte, schlechte Antwort: Mit jQuery können Sie dies einfach tun, egal wo die Deklaration ist:

$my_global_var = 'my value';

Und wird überall verfügbar sein. Ich benutze es, um schnelle Bildergalerien zu erstellen, wenn Bilder an verschiedenen Orten verteilt werden, wie zum Beispiel:

$gallery = $('img');
$current = 0;

$gallery.each(function(i,v){
    // preload images
    (new Image()).src = v;
});
$('div').eq(0).append('<a style="display:inline-block" class="prev">prev</a> <div id="gallery"></div> <a style="display:inline-block" class="next">next</a>');
$('.next').click(function(){
    $current = ( $current == $gallery.length - 1 ) ? 0 : $current + 1;
    $('#gallery').hide().html($gallery[$current]).fadeIn();
});
$('.prev').click(function(){
    $current = ( $current == 0 ) ? $gallery.length - 1 : $current - 1;
    $('#gallery').hide().html($gallery[$current]).fadeIn();
});

Tipp : Führen Sie den gesamten Code in der Konsole auf dieser Seite aus ;-)

Hier ist ein grundlegendes Beispiel für eine globale Variable, auf die der Rest Ihrer Funktionen zugreifen kann. Hier ist ein Live-Beispiel für Sie: http://jsfiddle.net/fxCE9/

var myVariable = 'Hello';
alert('value: ' + myVariable);
myFunction1();
alert('value: ' + myVariable);
myFunction2();
alert('value: ' + myVariable);


function myFunction1() {
    myVariable = 'Hello 1';
}

function myFunction2() {
    myVariable = 'Hello 2';
}

Wenn Sie dies innerhalb einer jquery ready () -Funktion tun, stellen Sie sicher, dass sich Ihre Variable zusammen mit Ihren anderen Funktionen in der ready () -Funktion befindet.

Deklarieren Sie die Variable außerhalb von Funktionen

function dosomething(){
  var i = 0; // can only be used inside function
}

var i = '';
function dosomething(){
  i = 0; // can be used inside and outside the function
}

Der beste Weg ist zu verwenden closures, weil das windowObjekt sehr, sehr wird überladen wird mit Eigenschaften ist.

Html

<!DOCTYPE html>
<html>
  <head>
    <script type="text/javascript" src="init.js"></script>
    <script type="text/javascript">
      MYLIBRARY.init(["firstValue", 2, "thirdValue"]);
    </script>
    <script src="script.js"></script>
  </head>

  <body>
    <h1>Hello !</h1>
  </body>    
</html>

init.js (Basierend auf dieser Antwort )

var MYLIBRARY = MYLIBRARY || (function(){
    var _args = {}; // private

    return {
        init : function(Args) {
            _args = Args;
            // some other initialising
        },
        helloWorld : function(i) {
            return _args[i];
        }
    };
}());

script.js

// Here you can use the values defined in the html as if it were a global variable
var a = "Hello World " + MYLIBRARY.helloWorld(2);

alert(a);

Hier ist die plnkr . Hoffe es hilft!