2010-07-28 6 views

Répondre

207

Si vous devez générer des variables globales dans le code de production (qui devrait être évité) toujours les déclarer explicitement:

window.globalVar = "This is global!"; 

Bien qu'il soit possible de définir simplement en omettant var une variable globale (en supposant qu'il n'y a pas de variable locale du même nom), ce qui génère un implicite global, ce qui est une mauvaise chose à faire et générerait une erreur en en mode strict.

+0

'window' est disponible uniquement dans les navigateurs. Pourriez-vous éditer votre réponse pour la faire fonctionner dans tous les environnements? Voir [Comment obtenir l'objet global en JavaScript?] (Http://stackoverflow.com/q/3277182/3853934) –

+0

** Jamais ** utiliser camelCase, Earth est le premier spectacle de cirque du multivers et quelqu'un quelque part * le fera * standardisez votre [insérer le nom de l'objet fou ici]. S'en tenir aux tirets comme séparateurs dans les URL et aux traits de soulignement pour les séparateurs dans le code ('window.class_list'). – John

50

Si c'est la seule application où vous allez utiliser cette variable, l'approche de Felix est excellente. Cependant, si vous écrivez un plugin jQuery, prenez en compte les variables et les fonctions "namespacing" (détails sur les citations plus tard ...) nécessaires sous l'objet jQuery. Par exemple, je travaille actuellement sur un menu contextuel jQuery que j'ai appelé miniMenu. Ainsi, j'ai défini un "namespace" miniMenu sous jQuery, et je place tout là-bas.

La raison pour laquelle j'utilise des guillemets lorsque je parle d'espaces de noms javascript est qu'ils ne sont pas vraiment des espaces de noms dans le sens normal. Au lieu de cela, j'utilise simplement un objet javascript et place toutes mes fonctions et variables en tant que propriétés de cet objet. De plus, par commodité, je sous-espace généralement l'espace de nom du plugin avec un espace de noms i pour les choses qui ne devraient être utilisées que de manière interne dans le plugin, afin de le cacher aux utilisateurs du plugin.

Voilà comment cela fonctionne:

// 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(); 

Maintenant, je peux faire $.miniMenu.i.globalVar = 3 ou $.miniMenu.i.parseSomeStuff = function(...) {...} chaque fois que je dois sauver le monde quelque chose, et je continue toujours hors de l'espace de noms global.

+0

Merci pour cela Tomas, Dans le site que j'ai mentionné ci-dessus Felix approche fonctionne bien, mais j'ai un autre site sur lequel je travaille également qui utilise plusieurs plugins et votre approche serait idéale si je peux le faire fonctionner. Bravo pour votre aide. – Dancer

+0

Cela fonctionne parfaitement bien! Assurez-vous que @Tomas dit, faites votre propre classe/titulaire pour vos propres fonctions ou variables personnalisées. +1 – Pierre

+0

Merci Tomas! Si cela n'est plus nécessaire, supprimez l'objet parent (par exemple: 'delete $ .miniMenu'). Est-ce que c'est bon? – KunJ

15

Voici un exemple de base d'une variable globale à laquelle le reste de vos fonctions peut accéder. Voici un exemple en direct pour vous: 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'; 
} 

Si vous faites cela dans une jquery fonction prêt(), alors assurez-vous que votre variable est à l'intérieur de la fonction prêt() alongwith vos autres fonctions.

+0

Meilleure réponse sur le fonctionnement des variables globales dans jQuery. –

+0

Je sais que je suis grave, mais ce n'est même pas une variable globale explicite. Ceci est plus en accord avec une variable publique partagée non limitée à une fermeture pour des scripts extrêmement petits. Ce sont deux méthodes/usages entièrement différents et celui-ci vous causera de gros problèmes si vous déclarez un global explicite dans un script qui se trouve au milieu de plusieurs scripts différents. Je ne peux qu'imaginer un frontal sur mon équipe déclarant une variable globale au sommet d'un script qui est le 10ème appelé dans le DOM. –

4

Déclarez la variable en dehors des fonctions

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

Avec jQuery, vous pouvez simplement le faire, peu importe où la déclaration est:

$my_global_var = 'my value'; 

et sera disponible partout. Je l'utilise pour faire des galeries d'images rapides, lorsque les images sont réparties en différents endroits, comme ceci:

$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(); 
}); 

Astuce: exécuter ce code entier dans la console dans cette page ;-)

+1

Les variables globales $ gallery et $ current ne sont-elles pas normales? Ils fonctionnent parce que vous les définissez comme des variables globales en omettant 'var', mais le signe dollar devant eux ne les transforme pas en 'variables jQuery' ... C'est littéralement comme mettre un trait de soulignement ou n'importe quel autre signe à partir d'eux ... Ils seraient des variables jQuery si vous utilisez l'objet jQuery ($) et ajoutez une propriété à celui-ci: $ .myGlobalVariable = 'ma valeur' ​​... –

+0

Vous avez probablement raison, mais que Il est intéressant de noter que l'utilisation de la syntaxe $ myVar vous donne 2 aventages, 1) la variable est globale sans aucune déclaration spéciale (en plus du $); et 2) vous pouvez suivre vos variables globales très facilement dans le code. Ouvert à la discussion si ... – aesede

3

Le le meilleur moyen est d'utiliser closures, parce que l'objet window obtient très, très encombré avec des propriétés.

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 (Basé sur this answer)

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

Voici le plnkr. J'espère que ça aide!

Questions connexes